4

.zclip()ボタンにアタッチしてから起動してから削除する最良の方法は何.zclip()ですか? それは十分に単純に聞こえますが、私はそれを協力させることができません。多くのボタンを含むページがあり、いくつかは直接アクセスでき、いくつかのボタンはさまざまなアコーディオンやタブからアクセスできます。コピー ターゲットの多くには動的データが含まれており、その一部は ajax を介して挿入されます。また、セクションの多くは折りたたみ可能です。.zclip()セクションが閉じるときにボタンにアタッチする フラッシュ オーバーレイが存在する場合、アニメーションに不具合が発生します。

私はいくつかの異なる方法からこれにアプローチしようとしました:

すべてのボタン要素をアタッチ.zclip()し、設定された間隔でページを更新します。動的データをキャプチャしますが、そのパフォーマンスはひどいものです。

およびイベントに.zclip()基づいてアタッチおよび削除するだけでなく、および. この方法でアタッチすると、すべてのイベントが毎秒何度も発生し、複数のフラッシュ オーバーレイが 1 つのボタンにバインドされます。 mouseentermouseleavemouseovermouseout

.zclip()とに基づく取り付け.hover()と取り外し.hoverIntent()。これは上記の試みよりも優れた動作をし、動的データをキャプチャしますが、イベントはかなり静止しています。.hover()親セクションで実行.zclip()して、そのセクションのすべてのボタンに接続しようとしました。それは機能しますが、そのパフォーマンスはひどいものです。

これには簡単な解決策があると確信していますが、それを理解することはできません。.zclip()経由でバインドでき.click()、ボタンに取り付けられます。.zclip()パラメータを介して削除できafterFunctionます。click追加のイベントをボタンに渡し、.zclip()アタッチすると起動する方法がわかりません。動作しますが、ボタンを 2 回クリックする必要があります。それをアクティブにしたら、それを発射して削除するもの。追加のclickイベントをボタンではなくフラッシュオーバーレイに送信する必要があるのではないかと考えていました。おそらく誰かが私を正しい方向に向けることができますか？

zClipホームページ

このコードの jsFiddle:

<div id='copy'>Test</div>
<button>Click Here To Copy The Div Above!</button>
<span id='success'>Success!</span>

#copy{
    height: 100px;
    width: 200px;
    padding: 3px;
    margin-bottom: 5px;
    border: 1px solid black;
    border-radius: 6px;
}
#success{
    color: rgba(84,240,84,1);
}

$(document).ready(function() {
    var copySuccessHide = function(){
        $( "#success" ).css({opacity: 0.0, visibility: "visible"});
    };
    copySuccessHide();/*hide the success indicator*/
    var copyData = $("#copy").text();/*get data from copy target*/
    var afterCopyFunction = function(){
        $("#copy").effect( "highlight" , {color : "rgba(230,255,230,1)" }, 1000 )
        $("#success").effect( "pulsate", "fast", copySuccessHide );
        $("button").zclip('remove');/*remove zclip*/
        };

    $("button").click(function () {/*bind zclip to the button on click*/
        $("button").zclip({
                path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
                copy: copyData,
                afterCopy: afterCopyFunction,
                clickAfter: false
            });
    });
});
4

1 に答える 1

0

上記のすべてのコメントに同意しますが、試してみることが 1 つあります。

 $("button").click(function () {/*bind zclip to the button on click*/
        $(this).zclip({
                path: "http://www.steamdev.com/zclip/js/ZeroClipboard.swf",
                copy: copyData,
                afterCopy: afterCopyFunction,
                clickAfter: false
            });
    });

$(this).... を使用すると、現在クリックされているボタンのみを zclip コンストラクターにバインドします。$("button").... を使用すると、単一のボタンがクリックされるたびに、ページ上のすべてのボタンで zclip コンストラクターが呼び出されます。

于 2013-01-24T17:20:10.483 に答える