ホームページ  >  記事  >  ウェブフロントエンド  >  jqueryでテーブル内のtrが選択されているかどうかを確認する方法

jqueryでテーブル内のtrが選択されているかどうかを確認する方法

WBOY
WBOYオリジナル
2021-12-01 12:06:392683ブラウズ

方法: 1. click() メソッドを使用して、クリック イベントを tr 要素にバインドし、イベント処理関数を指定します。 2. ステートメントで "$(selector).index(element)" を使用します。判定するイベント処理関数 要素が選択されているかどうかを指定し、選択されている要素の位置を出力するだけです。

jqueryでテーブル内のtrが選択されているかどうかを確認する方法

このチュートリアルの動作環境: Windows7 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。

jquery はテーブル内の tr 要素が選択されているかどうかをどのように判断しますか

click() メソッドと Index() メソッドを使用できますtr 要素が選択されているかどうかを判断します。

click() メソッドは、要素がクリックされるとクリック イベントが発生することを示します。クリックは、マウス ポインターが要素上に置かれ、マウスの左ボタンが押されて放されると発生します。 click() メソッドは、クリック イベントをトリガーするか、クリック イベントの発生時に実行する関数を指定します。

index() メソッドは、指定された他の要素に対する相対的な指定された要素のインデックス位置を返します。

例は次のとおりです。

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(function(){
    var myRows = $(&#39;table tr&#39;).click(function(){
        alert(&#39;Row #&#39; +myRows.index(this));
    });
});
</script>
</head>
<body>
<table width="300" border="1" cellspacing="1" cellpadding="2">
  <tr>
    <td width="150">0-1</td>
    <td width="150">0-2</td>
  </tr>
  <tr>
    <td>1-1</td>
    <td>1-2</td>
  </tr>
  <tr>
    <td>2-1</td>
    <td>2-2</td>
  </tr>
  <tr>
    <td>3-1</td>
    <td>3-2</td>
  </tr>
  <tr>
    <td>4-1</td>
    <td>4-2</td>
  </tr>
</table>
</body>
</html>

出力結果:

jqueryでテーブル内のtrが選択されているかどうかを確認する方法

最初の行が選択された場合の出力結果:

jqueryでテーブル内のtrが選択されているかどうかを確認する方法

推奨される関連ビデオ チュートリアル: jQuery ビデオ チュートリアル

以上がjqueryでテーブル内のtrが選択されているかどうかを確認する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。