JavaScriptコピー関数呼び出し実装ソリューション_基礎知識

コードをコピー コードは次のとおりです:

確認コード:



最近、心配事が増えて、ブログを書く気分になりません。

やあ！話がそれましたが、この記事に戻ります。 js を使用してクリックしてコピー機能を実装する場合、以下で説明する方法はインターネット上にある方法と似ています。 js の実装は非常に簡単です。結局のところ、互換性の問題が依然として IE 以外を使用している人が多いのです。ここでは、インターネット上の関連リソースに基づいた方法もまとめます。


方法1、一つずつ識別して処理する方法

方法は非常にシンプルでわかりやすい、異なるjsコードを実行してコピー機能を実現する方法です。クライアントのブラウザの種類。理論上はこれでうまくいきますが。しかし、それは私たちが思っているほど簡単ではありません。一部のブラウザで js コピー コードを記述する方法についてはあまりわかっていないため、少なくとも私が知っているのは IE と FF です。 IE と FF のみに対応していれば、もっと簡単になります。ここでは、インターネット上で比較的よく知られている IE コアを決定する方法、つまり私もよく使用している 13 バイト方式を使用します。

コードをコピー コードは次のとおりです。 if("v"=="v ") { //13 バイト

//ここに IE コア、実行コードがあり、IE8 との互換性があることが個人的にテストされています

}else{
//IE コア以外の実行コード
}


ここでは、レプリケーションを実現するための大まかな構造を書きます。具体的なコードは貼り付けません。参考までに。

コードをコピー コードは次のとおりです: function ClipBoard(object){

//オブジェクトの値を取得します。つまり、コピーします。コンテンツ

var copyTxt=document.getElementById(object ; 🎜>}
copy2Clipboard = function(txt){
if("v"=="v"){
//IE ブラウザの実行code
window.clipboardData.clearData();
window.clipboardData.setData("Text",txt);
return
}else if(navigator.userAgent.indexOf("Firefox") )>0){
//Firefox ブラウジング
return true;else if(window.google && window.chrome){
//chrome ブラウザ
return true; >}else{
alert("ブラウザは "をサポートしていません");
return false;
}
}


として、別の判定ブラウザ コードを追加できます。そのブラウザでコピー機能を実現するために必要です。通常は、IE＞FF＞opera/chrome＞その他の順で判断されます。


方法 2、フラッシュ間接処理方法

原理は非常に簡単で、フラッシュを作成すると、コピーされた内容が変数の形でフラッシュに渡され、フラッシュが生成されます。次に、コンテンツをメモリにコピーし、コピー機能を実現します。 Flash をサポートしている限り、理論的にはほとんどのブラウザと互換性があるこの方法は、今日私が見たものであり、テストおよび検証されています。

インストールと使用方法は、上記 2 つの Web サイトで見つけることができます。電子テキスト版と中国語版は、検索でのみ見つけることができます。
ここでは、上記の実装方法を使用した実装フレームワークの簡易バージョンを提供します。公式バージョンの説明書によれば、この機能は 1 つのページで簡単に実装できますが、一部の CMS で実際に使用すると、いくつかの問題が発生する可能性があります。何が問題ですか? IE コア ページに「このページは終了しました」というメッセージが表示されます。理由は非常に簡単で、jsの読み込みが完了する前に呼び出されるからです。 IE に問題があることが判明した場合は、IE を判定する方法を使用して IE を分離し、他のコアはフラッシュ方式を使用して実装できます。

コードをコピー

コードは次のとおりです:

function checkClient(object){//ブラウザを決定します
var copyTxt=document.getElementById(object).value; //コピーされたコンテンツを取得します
if("v"!="v "){
//公式ドキュメントに従ってここにフラッシュ位置を設定します
//絶対的または相対的にここにフラッシュ位置を設定します
ZeroClipboard.setMoviePath('ZeroClipboard.swf');
/ /コピーオブジェクトを作成します
var Clip = new ZeroClipboard.Client()
//手の形状を設定します
clip.setHandCursor(true);
//コピーされたコンテンツを設定します
クリップ.setText(copyTxt);
// トリガー オブジェクトを設定します
>clip.glue('d_clip_button');
}
}

IE コアはフラッシュ処理を使用せず、コピー メカニズムを直接使用します

コード コードは次のとおりです。

// コピー処理
function ClipBoard(object){
var copyTxt=document.getElementById(object).value;
if(copy2Clipboard(copyTxt); )!= false){
alert('コピー成功') ;
}
}
copy2Clipboard = function(txt){
if("v"=="v") { //IE ブラウザであるかどうかを判断します。
window.clipboardData.clearData();
return true
}
else; { //非 IE コアは直接
return true; }


上記は 2 番目のメソッドの最も簡単な設定方法です。 の間にコードを置くだけです。 ;/head> 1 番目の方法でも 2 番目の方法でも、コピーする必要があるページに次の 2 行のコードを追加する必要があります。

コピーしたコンテンツのテキスト フィールドを設定します。

コードをコピー コードは次のとおりです:

onmouseout="checkClient('textinfo')" value="コピーされたコンテンツ" size ="65"/>


トリガー オブジェクト ボタンを設定

コードをコピーします コードは次のとおりです:

アドレスをコピー

これは 2 番目の方法です。追加するには、検出ブラウザを設定します

コードをコピーします コードは次のとおりです:

ここに書かれている、一般的な手順は次のとおりで、一部の ID 名は必要に応じて変更できます。少なくとも完全なコードについては、公式デモを参照してください。

疲れた。