如何不使用jQuery仅选择表中的特定元素?
我有这个小提琴:http://jsfiddle.net/v9s5ezpb/1/如何不使用jQuery仅选择表中的特定元素?
HTML
<table>
<tr>
<td>test1</td>
<td>test2</td>
<td><a href="#">test3</a></td>
<td>test4</td>
<td>test5</td>
<td class="no-alert">test6</td>
</tr>
</table>
CSS
table {
border: 1px solid #000;
}
table td {
border: 1px solid #000;
padding: 10px;
}
JS
$(document).on('click', 'table td:not(.no-alert, a)', function()
{
alert(1);
});
我希望我的代码来执行每一次的警告窗口,我点击任何表TD项目,除了那些具有类特定的或有一个锚标记的项目。
这怎么可能?
一个<td>
不能是一个<a>
,但它可以有后代<a>
,而您可以使用:has()
选择。
$(document).on('click', 'table td:not(.no-alert, :has(a))', function()...
编辑:上<td>
与<a>
但不更新使点击时<a>
为目标
$(document).on('click', 'table td:not(.no-alert)', function(event){
if(!$(event.target).closest('a').length){
// is not click on <a>` tag
}
});
用于closest()
万一<a>
检查目标具有像<i>
或<img>
这可能是任何孩子实际的目标
看起来这样会阻挡整个TD小区。不过,我希望TD的其他部分给我一个弹出消息。只有那个''''标签应该是例外。 –
OK ......为此,我们需要使用'event.target' ......一分钟后 – charlietfl
@charlietfl有趣的更新,以前没有看到'.closest()'用于检查元素对本身。也可以代替'。是()''为.closest()。length' – guest271314
*“或者是一个锚标记” * - 提示:你的第三个TD元素不是一个锚标记,它包含了* *一个锚标记。 – nnnnnn
@nnnnnn谢谢,纠正。 –