1

こんにちはみんな私はこのコードを持っています:

$('#riscButton, #eneButton, #giardButton').one("click", function(){
                $('.content').animate(
                    {"height":"+=620px"},
                    500,
                    'easeOutBounce');
                $('#eneButton').animate(
                    { "top":"+=310px"},
                    1500,
                    'easeInOutExpo');
                $('#eneButton').animate(
                    {"left":"-=310px"},
                    1500,
                    'easeOutBounce')
                $('#giardButton').animate(
                    {"top":"+=620px"},
                    2000,
                    'easeInOutExpo')
                });

誰かがボタンをクリックするとアニメーションが発生することがわかるように、どのボタンをクリックしても同じアニメーションが発生するかどうかは重要ではありません。one() を使用して、一度だけクリックする必要があるボタンに言いますが、これが問題です。1 つのボタンを押すと、他のボタンを無効にする必要があることをスクリプトにどのように伝えることができますか? たとえば、最初のボタンをクリックするとアニメーションが発生し、同じボタンを再クリックしても何も起こりませんが、2 番目または 3 番目のボタンをクリックするとアニメーションが再び開始されます。どうすれば修正できますか？

4

3 に答える 3

3

クリックした要素だけでなく、すべての要素からイベントのバインドを解除する必要があります。

$('#a, #b, #c').click(function() {
    alert('clicked');

    $('#a, #b, #c').off('click');
});​

デモ: http://jsfiddle.net/peFff/3/

より良い解決策は、クラスを使用することです。

$('.clickable').click(function() {
    alert('clicked');

    $('.clickable').off('click');
});​

デモ: http://jsfiddle.net/peFff/5/

于 2012-10-11T18:12:58.220 に答える
0

最初のクリックで、1 つのボタンがクリックされたことを示すクラスをコンテナー タグに追加するだけです。その後のクリックでは、アニメーションを呼び出す前に、コンテナーにクラスがあるかどうかを確認します。

于 2012-10-11T18:12:32.280 に答える
0

セレクターを使用します。例：$('#riscButton, #eneButton, #giardButton').attr('disabled','disabled')関数内。そのセレクターは、すべてのボタンを含む配列を返します...そして、ボタンのバインドを解除する必要があります...$('#riscButton, #eneButton, #giardButton').off('click.button')

名前空間のイベント名に .button を追加し、見つけやすくします (不要なイベント ハンドラーのバインドを解除することも回避できます)。

最後の注意: 最後$('#a,#b,#c')に、セレクターのようなことをしなければならない場合は、代わりにクラスを使用することを検討する必要があります (コードをより良くするだけです)。

于 2012-10-11T18:09:30.680 に答える