Question

HTML：

<tr id="tr">
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
</tr>

Jquery的

$("#tr").click(function(){

// something happen

});

所以，问题是：

点击效果显然会获得<tr>

中的所有内容

当我点击<tr>内的前3个td时，点击效果会发生吗？

编辑

如果我有超过1 tr

<tr class="tr">
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
</tr>
<tr class="tr">
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
     <td>Somthing</td>
</tr>

解决方案td:lt(4)仅适用于第一个tr ps。：我需要识别tr，因为我在使用tr的代码中有另外的东西

我的真实代码是：

$(".class td:lt(6)").live("click", function(){


 });

达摩： http://jsfiddle.net/w3hKf/4/

Answer 1

尝试使用lt (less than) selector。

$('.specialTD td:lt(4)').click(function(){

// what cell was clicked?
var clickedId = $(this).attr('id');

});

更新：

您可以为所有行指定一个相同的类名，并为每个td指定一个单独的ID。见上面的更新示例

Answer 2

你可以将事件处理程序绑定到第三个元素，如下所示：

$("#tr td:eq(2)").click(function(){

// somthing happen

});

Answer 3

是的，你可以！

JSfiddle DEMO

//########## using :lt() selector

$('#test1 li:lt(3)').css({color: '#cf5'});

$('#test1 li:lt(3)').click(function() {
    $(this).css({color: '#caf'});
});

//########## using .slice() method for better performance

$('#test2 li').slice(0, 3).css({color: '#cf5'});

$('#test2 li').click(function() {
    $(this).slice(0, 3).css({color: '#caf'});
});

“因为：lt（）是一个jQuery扩展而不是CSS规范的一部分，使用：lt（）的查询无法利用本机DOM querySelectorAll（）方法提供的性能提升。为了在现代浏览器中获得更好的性能，使用$（“your-pure-css-selector”）。切片（0，索引）代替。“（jQuery.com）

文档：
http://api.jquery.com/lt-selector/
http://api.jquery.com/slice/

Answer 4

$("tr#tr td:not(:last)").click(function(){

// somthing happen

});

设置点击将要发生的位置

4 个答案:

JSfiddle DEMO