Clicking a row except for the first td

2019-04-29 12:22发布

站内问答 / jQuery
1719 4 6

I am trying to click a table row and perform an action. However if they click the first <td> cell I do not want that to perform the action.

Here is the code I have so far:

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

        openMessage(oTable, nTr);
    });

This works as intended, except the first <td> has a check box, so if they click in that cell I do not want to call the openMessage(oTable, nTr); function.

I also still need nTr to = the contents of the row.

4条回答
beautiful°
2楼-- · 2019-04-29 12:32 
 $("#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>

查看更多
0人赞 添加讨论(0) 举报
我想做一个坏孩纸
3楼-- · 2019-04-29 12:40

Use target of click within row, and check the index of TD

Simplified DEMO: 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);
}
});

live() is deprecated , if using jQuery >= 1.7 convert to on(). Following assumes main table is a permanent asset in page.

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

This line in your code is redindant, it simply returns the same as this

nTr = jQuery(this)[0];
查看更多
0人赞 添加讨论(0) 举报
Bombasti
4楼-- · 2019-04-29 12:50

You could try adding a class or unique id to that <td> element. Then in your handler you test against it.

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);
  }
});
查看更多
0人赞 添加讨论(0) 举报
三岁会撩人
5楼-- · 2019-04-29 12:54

This'll do the trick:

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');    
}

​

Here's the fiddle to test: DEMO

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)