ホームページ > 記事 > ウェブフロントエンド > jqueryはイベントを複数の要素に同時にバインドできますか?
jqueryはイベントを複数の要素に同時にバインドできますか?
- WBOYオリジナル
- 2022-04-26 17:31:262644ブラウズ
jquery はイベントを複数の要素にバインドできます。バインド方法: セレクターを使用して要素を選択する場合、要素セレクターをカンマで区切ってイベントを複数の要素にバインドし、複数のセレクターの混合使用をサポートします。構文は「$(要素 1, 要素 2, 要素 3.. .).Event (イベントハンドラー関数)」。
このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。
jquery は同時に複数の要素にイベントをバインドできますか?
開発プロセス中に、テーブル内の各行または列に同じイベントをバインドすることに遭遇しました。使用されるメソッドは jquery です。列要素を走査し、foreach を使用してイベントを各セルにバインドします。今日説明するのは、異なる要素に対して同じクリック イベントをインタラクティブにトリガーするバインド方法です。
具体的な方法は次のとおりです:
$("#id1, .class1, #id2, .class2").unbind("click").click(function(){
console.log("test");
})セレクターを使用して要素を選択する場合は、英語のカンマを使用して要素を区切ります。同時にセレクターの混合使用がサポートされているため、同じイベントはさまざまな要素にバインドできます。
例は次のとおりです:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".bt1,#bt1").click(function(){
$("p").slideToggle();
});
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button class="bt1">切换</button>
<button id="bt1">切换</button>
</body>
</html>出力結果:
以上がjqueryはイベントを複数の要素に同時にバインドできますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。