【问题标题】:Clicking a row except for the first td单击除第一个 td 之外的行
【发布时间】:2016-10-19 20:37:26
【问题描述】:

我正在尝试单击表格行并执行操作。但是,如果他们单击第一个 <td> 单元格,我不希望它执行该操作。

这是我目前的代码:

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

        openMessage(oTable, nTr);
    });

这按预期工作,除了第一个 <td> 有一个复选框,所以如果他们单击该单元格,我不想调用 openMessage(oTable, nTr); 函数。

我还需要 nTr 来 = 行的内容。

【问题讨论】:

标签: jquery datatables


【解决方案1】:

使用行内点击目标,查看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);
}
});

live() 已弃用,如果使用 jQuery >= 1.7 转换为 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];

【讨论】:

  • 我能够让它工作,并将转换为使用 .on 。谢谢你。 :)
【解决方案2】:
 $("#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>

【讨论】:

    【解决方案3】:

    这样就可以了:

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

    这是要测试的小提琴:DEMO

    【讨论】:

    • ??对我来说适用于除每行中的第一个单元格之外的所有行
    【解决方案4】:

    您可以尝试向 &lt;td&gt; 元素添加一个类或唯一 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);
      }
    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2011-08-26
      • 1970-01-01
      • 2023-01-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多