【问题标题】:How to remove click event on table first row如何删除表格第一行的点击事件
【发布时间】:2017-07-13 16:48:57
【问题描述】:

我尝试用这个在表格的每一行上设置点击事件。

这是表:

<table border='1px'>
    <tr>
        <td class='td'>first row frist column</td>
        <td>first row second column</td>
    </tr>
    <tr>
        <td class='td'>second row frist column</td>
        <td>second row second column</td>
    </tr>
    <tr>
        <td class='td'>third row frist column</td>
        <td>third row second column</td>
    </tr>
</table>

这是简单的 jQuery:-

$('table tbody tr  td:nth-child(1)').live('click',function(){
alert($(this).text());
})

有了这个我点击任何第一列然后在它的警报我想取消设置表第一行列点击事件。

我该怎么做。

【问题讨论】:

    标签: jquery html html-table click


    【解决方案1】:

    试试这个,DEMO http://jsfiddle.net/yeyene/CGbXP/4/

    给所有列一个类col+number。然后使用...

    var i = 1;
    $('td').each(function(){    
        $(this).addClass('col'+i);
        i = i+1;
    });
    
    $('table').find("td:not(.col4)").on('click',function(){
        alert($(this).text());
    })
    

    【讨论】:

    • 我想在那里设置第二列 id...如何?
    • 不不...我想设置第一行第二列 id='second' 类似于&lt;tr&gt; &lt;td class='td'&gt;first row frist column&lt;/td&gt; &lt;td id='second'&gt;first row second column&lt;/td&gt; &lt;/tr&gt;
    • 您只想在第一行 - 第二列禁用?
    • 实际上我每行有六个列,所以我想删除第一行第五列类。
    • 不错的尝试,但我有六列并且都有相同的 id='xyz'...所以无法设置手动 id 或类
    【解决方案2】:

    您可以使用:not() 伪选择器从您的点击绑定中排除第一行。

    $('table tbody tr:not(:first) td:first-child')
    

    这会将点击处理程序附加到所有第一列,但第一行中的第一列除外。 Here 是上面的 jsFiddle。

    【讨论】:

      【解决方案3】:

      试试这个代码

          $('table tbody tr:not(:first-child)  td').click(function(){
      alert($(this).text());
      })
      

      http://jsfiddle.net/pepean/JP9EM/

      【讨论】:

        【解决方案4】:

        您可以立即排除选择器中的第一行,方法是指定它只应用于索引大于 0 的所有行:

        $('table tbody tr:gt(0) td:nth-child(1)').live('click',function(){
            alert($(this).text());
        });
        

        但是,在最近的 jQuery 版本中,.live 已被弃用,甚至在 1.10 中被删除,因此您应该改用 .on

        $('table tbody tr:gt(0) td:nth-child(1)').on('click',function(){
            alert($(this).text());
        });
        

        最后,如果您应该有嵌套表,您的选择器将返回太多的命中。改为选择直接子代:

        $('table > tbody > tr:gt(0) > td:nth-child(1)').on('click',function(){
            alert($(this).text());
        });
        

        演示:http://jsfiddle.net/2FkDY/

        【讨论】:

          【解决方案5】:

          不再推荐使用 .live() 方法,因为更高版本的 jQuery 提供 没有缺点的更好的方法

          .live 在最新版本的 jquery 中已弃用。

          试试这个

          $('table tbody tr:not(:first)').on('click',function(){
          alert($(this).text());
          });
          

          JsFiddle

          【讨论】:

          • 我想在那里设置第二列 id...如何?
          【解决方案6】:

          我认为您不必在第一行上课,然后使用onclick 事件。

          $('.td').on('click', function() { 
               //do your stuff here
          
          });
          

          希望对你有帮助

          【讨论】:

            猜你喜欢
            • 2017-05-17
            • 2020-04-03
            • 1970-01-01
            • 2021-02-07
            • 2014-04-19
            • 2017-07-03
            • 1970-01-01
            • 1970-01-01
            • 1970-01-01
            相关资源
            最近更新 更多