6

テーブルの行をクリックしてアクションを実行しようとしています。ただし、最初のセルをクリックした場合、その<td>セルでアクションを実行することは望ましくありません。

これが私がこれまでに持っているコードです:

jQuery('#dyntable tbody tr').live('click', function () {
        nTr = jQuery(this)[0];

        openMessage(oTable, nTr);
    });

これは意図したとおりに機能しますが、最初のチェックボックスがあります。そのため、そのセルをクリックした場合、o関数<td>を呼び出したくありません。penMessage(oTable, nTr);

nTrまた、行の内容を=する必要があります。

4

4 に答える 4

15

行内のクリックのターゲットを使用して、TDのインデックスを確認します

簡略化されたデモ:http://jsfiddle.net/WLR9E/

jQuery('#dyntable tbody tr').live('click', function (evt) {
    var $cell=$(evt.target).closest('td');
    if( $cell.index()>0){
       openMessage(oTable, this);
}
});

jQuery> = 1.7を使用している場合、live()は非推奨になります。on()に変換します。以下は、メインテーブルがページ内の永続的なアセットであると想定しています。

jQuery('#dyntable').on('click','tbody tr', function (evt) {
    var $cell=$(evt.target).closest('td');
    if( $cell.index()>0){
       openMessage(oTable, this);
   }
});

あなたのコードのこの行は冗長です、それは単に同じものを返しますthis

nTr = jQuery(this)[0];
于 2012-06-20T17:25:56.287 に答える
10
 $("#dyntable tbody").on('click', 'tr td:not(:first-child)',function () {
    alert("success");
});

$(document).ready(function ()
{
   $("#tbluserdata tbody").on('click', 'tr td:not(:first-child)', function () {
      alert("write code");
    });
  
 });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
  <head>
    </head>
  <body>
    <table border="2" width="50%" id="tbluserdata">
      <thead>
        <tr>
          <th>Id</th>
        <th>Name</th>
        <th>Address</th>
          <th>Action</th>
          </tr>
        </thead>
      <tbody>
      <tr>
        <td>1</td>
        <td>aaa</td>
        <td>ccc</td>
         <td>delete</td>
        </tr>
      <tr>
        <td>1</td>
        <td>aaa</td>
        <td>ccc</td>
        <td>delete</td>
        </tr>
      <tr>
        <td>1</td>
        <td>aaa</td>
        <td>ccc</td>
        <td>delete</td>
        </tr>
        </tbody>
      </table>
    </body>
</html>

于 2016-10-19T12:37:26.197 に答える
2

これでうまくいきます:

jQuery('#dyntable tbody tr td:not(:first)').live('click', function () {
        nTr = jQuery(this).parent('tr')[0];

        openMessage("asdf", nTr);
});


function openMessage(oTable, nTr){
  console.log(nTr);
  alert('something happened');    
}

</ p>

テストするフィドルは次のとおりです。デモ

于 2012-06-20T17:25:30.813 に答える
0

<td>その要素にクラスまたは一意のIDを追加してみてください。次に、ハンドラーでそれに対してテストします。

jQuery('#dyntable tbody tr').live('click', function () {
  var $thisRow = jQuery(this); // cache this selector for performance
  nTr = $thisRow[0];
  if (!$thisRow.hasClass('not_this_one')){
    openMessage(oTable, nTr);
  }
});
于 2012-06-20T17:08:35.013 に答える