最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Making table rows but not table headers clickable in jquery - Stack Overflow

programmeradmin4浏览0评论

Currently I am using

$('#mytable tr').click(function() {
    blah blah
});

This makes all rows, including the headers clickable. How can I exclude the headers or <th>'s?

Currently I am using

$('#mytable tr').click(function() {
    blah blah
});

This makes all rows, including the headers clickable. How can I exclude the headers or <th>'s?

Share Improve this question edited Jan 25, 2012 at 13:50 Anthony Grist 38.3k8 gold badges64 silver badges76 bronze badges asked Jan 25, 2012 at 13:45 lodkkxlodkkx 1,1732 gold badges17 silver badges29 bronze badges
Add a ment  | 

4 Answers 4

Reset to default 8

Separate you header and body using <thead> and <tbody> tags, and change your selector to "#mytable tbody tr"

HTML will look something like this

<table> 
    <thead>
        <tr>
         ...
        </tr>
    </thead>
    <tbody>
         <tr>
            ...
         </tr>
    </tbody>
</table>

The easiest way, assuming you've marked your table up accurately, is to use:

 $('#mytable tbody tr').click(function() {
     blah blah
 });

Failing that:

 $('#mytable tr').filter(
     function(){
         return $(this).find('td').length;
     }).click(function() {
     $(this).addClass('clicked');
 });

JS Fiddle demo.

You can remove them with the not function:

$('#mytable tr').not('th').click(function() {
   blah blah
});

Or:

$('#mytable tr:not(th)').click(function() {
   blah blah
});

Use Jquery delegate

$("#mytable").delegate("td", "click", function() {
  //Do something
});

this should work

发布评论

评论列表(0)

  1. 暂无评论