検索

ホームページ >ウェブフロントエンド >jsチュートリアル >Js Flash はクリップボードへのアクセスを実装します。

Js Flash はクリップボードへのアクセスを実装します。

WBOY
WBOYオリジナル
2016-05-16 17:48:071194ブラウズ

最近、リンクをコピーするボタンをクリックしてこの問題を解決する必要がありました。最後に、クリップボード操作
を実装するオープン ソースの js Flash である ZeroClipBoard というソリューションを見つけました。しかし、多くの例を検索したところ、ほとんどの例では、ページ
に対して 1 つの固定コピー操作しか導入されていないことがわかりました。
そして私の要件はこれです
動的リピーターは各アドレスとコピーボタンを動的にロードします。
このソリューションの原理は次のとおりです。
js を使用して透明なフラッシュを動的にロードし、クリックしたいボタン上でそれをカバーし、フラッシュのホスト要素にイベントをバインドして値を動的に転送します。
フラッシュに複数のボタンを追加すると、大量のメモリが消費され、動的コードを作成するのが難しくなります。
最終的な解決策は次のとおりです:

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



1.ボディ内の非表示フラッシュ コンテナー 絶対位置
コードをコピー コードは次のとおりです:

varLocalUrlManage ={
Clip:null,
ClipContainer:null,
InitClip:function(){
LocalUrlManage.Clip=newZeroClipboard.Client();
LocalUrlManage.ClipContainer=$("#ClipSwf ");
LocalUrlManage.Clip .setHandCursor(true);
LocalUrlManage.Clip.setCSSEffects(true);
LocalUrlManage.Clip.addEventListener("complete",function(client,text){
Tip.RightTip("#UrlAdd"," "コピー成功!");
LocalUrlManage.ClipContainer.html(LocalUrlManage.Clip.getHTML(80,25)); }}


2. ページの読み込み時に js を使用してクリップボード オブジェクトを初期化し、マウス ジェスチャとホスト コンテナーを設定してから、Flash を HTML に出力してコンテナーに出力します。 >


コードをコピーします コードは次のとおりです: onmouseover="LocalUrlManage.SetClipValue(this,' #copyUrlValue<%#Eval("Id")%>')" >クリックしてコピー



コードをコピー コードは次のとおりです: SetClipValue:function(obj,SelectorEl){
//BrowserClip.IEClip($(SelectorEl).val()) ;
varoffset=$(obj).offset();
LocalUrlManage.offset({left:offset.left,top:offset.top}); SelectorEl).val());
}.


3. 各コピー ボタンにイベントを動的にバインドし、コピーする対応する値またはコントロールを関数に渡します。非表示の Flash コンテナーの上部のマージンを、イベントをトリガーして配置するボタン上に浮くようにします。コピーされる値は、
Clip.setText('text') (プラグインによって提供されるメソッド) を通じてフラッシュに渡されます。 ) これにより、複数のボタンをコピーする機能が実現されました。
ボタンの元の hovercss 切り替え効果は、その後は柔軟性が低下します。 jqueryで動的にスタイルを追加する効果はあまり良くありません。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：クリック矢印画像切り替え_画像特殊効果を実装する簡単な JS コード次の記事：クリック矢印画像切り替え_画像特殊効果を実装する簡単な JS コード

関連記事

続きを見る