ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery zclip プラグインはクロスブラウザー コピー function_jquery を実装します

jQuery zclip プラグインはクロスブラウザー コピー function_jquery を実装します

WBOY
リリース: 2016-05-16 15:34:05
オリジナル
1321 人が閲覧しました

jQuery-zclip は、コンテンツをクリップボードにコピーする jQuery プラグインです。これを使用すると、異なるブラウザーやブラウザーのバージョン間の互換性の問題を考慮する必要がなくなります。 jQuery-zclip プラグインを使用するには、Flash サポートが必要です。Adobe Flash Player を忘れずにインストールしてください。

1. jQuery-zclip の使用法

//引入jQuery-zclip相关js及swf文件
<script type="text/javascript" src="<%=path%>/resources/js/jquery.min.js"></script>
<script type="text/javascript" src="<%=path%>/resources/js/jquery.zclip.min.js"></script>
<script type="text/javascript">
$(function(){
  $("#cp-btn").zclip({
    path:'<%=path%>/resources/js/ZeroClipboard.swf', //记得把ZeroClipboard.swf引入到项目中 
    copy:function(){
      return $('#inviteUrl').val();
    }
  });
});
</script>

<div class=form-row>
  <div class=col-md-5>
    <input class=form-control value="" id="inviteUrl"/>
  </div>
  <div class=col-md-1>
    <a href="javascript:void(0)" id="cp-btn"
      class="btn btn-default btn-block btn-clean">复  制</a>
  </div>
</div>

ログイン後にコピー

設定手順
path:swf のパス (コピーでは主に Flash を使用して、異なるブラウザのコピーを解決します)
copy:コピーされるコンテンツは静的コンテンツであることも、動的コンテンツを返すこともできます
beforeCopy:前に実行する関数をコピーします;
afterCopy:コピー後に実行される関数;

3 つのメソッド
を提供します show:$(selected).zclip('show');//コピー機能は有効です
Hide:$(selected).zclip('hide');//コピー機能は無効です
Remove:$(selected).zclip('remove');//コピー機能を完全に削除します

2. デモンストレーション効果
操作が成功したら、コピー ボタンをクリックすると、次のようなプロンプト ボックスがポップアップ表示され、クリップボードへのコピーが有効になったことを示します。

ポップアップ ボックスに「テキストをクリップボードにコピーしました」という英語の文字が表示されますが、これは中国語の使用習慣と少し矛盾します。jQuery で「コピーされました」を見つけます。 .zclip.min.js ファイル 「クリップボードへのテキスト」を「クリップボードに正常にコピーされました」 に置き換えるだけで、効果は次のようになります:

上記は、jQuery zclip プラグインのクロスブラウザー コピー機能について編集者がまとめた内容であり、皆様の学習に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート