Web 開発では、同じ機能を実現するために同じイベントを複数のコントロールにバインドする必要があることがよくあります。たとえば、複数のボタンをクリックすると同じイベントがトリガーされます。 jQuery はこの機能を非常に便利に実装できるので、jQuery を使って複数のコントロールに同じイベントをバインドする方法を詳しく紹介します。
jQuery でイベントをコントロールにバインドするには、次のコードを使用できます。
$(selector).bind(eventType, handler);
その中で、 selector の意味 イベントをバインドするコントロール セレクター、eventType はバインドされるイベントの種類、handler はイベント処理関数を表します。たとえば、次のコードは、クリック イベントを ID btn のボタンにバインドします。
$('#btn').bind('click', function() { alert('按钮被点击了!'); });
実際の開発では、多くの場合、同じイベントを複数のコントロールに送信します。上記のコードを使用して各コントロールにイベントをバインドすると、非常に面倒になります。コードを簡素化するために、jQuery が提供するメソッドを使用して、イベントを複数のコントロールに同時にバインドできます。
$(selector1, selector2, ..., selectorN).bind(eventType, handler);
このうち、カンマで区切られた複数のセレクターは、イベントがバインドされる複数のコントロールを表しており、eventType と handler の意味は、イベントを 1 つのコントロールにバインドすることと同じです。たとえば、次のコードは、クリック イベントを ID btn1、btn2、btn3 を持つ 3 つのボタンにバインドします。
$('#btn1, #btn2, #btn3').bind('click', function() { alert('按钮被点击了!'); });
After jQuery 1.7 では、イベントをバインドするために on メソッドを使用することをお勧めします。 on メソッドの使用法は binding メソッドと似ていますが、構文が少し異なります。 on メソッドを使用して、同じイベントを複数のコントロールに同時にバインドすることもできます。
$(selector1, selector2, ..., selectorN).on(eventType, handler);
たとえば、次のコードは、クラス btn を使用してクリック イベントをすべてのボタンにバインドします。
$('.btn').on('click', function() { alert('按钮被点击了!'); });
必要なくなった場合コントロールのイベントのバインドを解除するには、jQuery が提供する unbind メソッドまたは off メソッドを使用できます。
$(selector).unbind(eventType, handler); $(selector).off(eventType, handler);
このうち、selector はイベントをアンバインドするコントロールセレクター、eventType はアンバインドするイベントの種類、handler はイベント処理関数を表します。たとえば、次のコードは、ID btn のボタンのクリック イベントをキャンセルします。
$('#btn').unbind('click'); $('#btn').off('click');
同じイベントを複数のコントロールにバインドする場合、Pay を行う必要があります。次の問題に注意してください。
上記は、jQuery を使用して同じイベントを複数のコントロールにバインドする方法の詳細な紹介です。同じイベントを複数のコントロールにバインドする必要がある状況が発生した場合は、実際のニーズに応じて適切な方法を選択してバインドおよびバインド解除できます。
以上が複数の jquery コントロールをイベントにバインドできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。