Question

我希望有人可以帮助我，我认为它必须是直截了当的，但我认为我错过了一些东西......我已经制作了一个表格，如果点击相同的单元格，将突出显示onclick或de-highlight。这个我没有问题。我遇到的问题是，如果我点击输入：文本或选择单元格中的元素，它仍会切换。

是否有一种简单的方法可以在选择器中添加not子句，或者查看是否在下面单击了select / input？

$("#grid td, #grid th").live('click', function(){
    ...
    toggle highlight, image changes, link changes, etc,  when conditions are met (currently works)
    ...
});

我想也许可以使用.not()函数，但我认为如果我仍然单击单元格而不是单击输入/选择，它可能不会切换。

任何帮助或帮助都会很棒！

Answer 1

这里发生的事件是从子元素向父元素冒泡的事件。

你可以做两件事，一件是检查触发事件的元素，如果是td则只允许它...这样的事情：

$("#grid td, #grid th").live('click', function(e){
    if (e.target.tagName.toLowerCase() === 'td' || e.target.tagName.toLowerCase() === 'th') {
        //do your stuff here
    }

});

或者看看在输入时停止事件并选择点击处理程序cancelBubble或event.stopPropogation

Answer 2

试试这个：

$('#grid td input, #grid th input, #grid td select, #grid th select, #grid td textarea, #grid th textarea').live('click focus', function(event) {
    event.stopPropagation();
});

EDİT：添加了select和textarea

在实时点击时切换突出显示tr / td，但如果单击输入/选择则不切换

2 个答案: