Question

当我用一个父类点击tr上的任何地方时，我试图触发一个动作。当我点击其中一个下拉框时排除。

$('tr.parent')
    .css("cursor", "pointer")
    .click(function (e) {
        if($(e.target).not('select')){
            // do something
    }

我尝试以下但是这不起作用。

http://jsfiddle.net/0Lh5ozyb/60/

Answer 1

试试这个：

$('tr.parent')
    .css("cursor", "pointer")
    .click(function (e) {
        if($(e.target).is("select"))
        {
          //... it was a select
        }
      else
       {
         //... it was not a select
       }
   }

Answer 2

jQuery的not是一种过滤方法。因此，它生成一个jQuery对象。当没有任何东西匹配时，它仍然返回一个空数组，这不是 falsy 。因此，您的测试始终有效。

您可以使用jQuery的测试运算符is调整您的测试，该运算符检查您的对象是否与选择器匹配。以下是Royi Namir's answer的优化：

$('tr.parent')
    .css("cursor", "pointer")
    .click(function (e) {
        if($(e.target).is(":not(select)")) {
          //... it was not a select
        }
    });

Answer 3

这可以解决Chrome和Firefox的问题：

$('tr.parent')
    .css("cursor", "pointer")
    .click(function (e) {                   
        if ($(e.target).is('select') || $(e.target).is('option')) {
            //
        } else {
            $(this).css('background-color', 'red');
        }
    });

$('tr[class^=child-]').find('td > div, td').hide();

JSFiddle test

编辑：简化版本，如果您在单击选择时不需要执行任何操作。

$('tr.parent')
    .css("cursor", "pointer")
    .click(function (e) {               
        if (!($(e.target).is('select') || $(e.target).is('option'))) {
            $(this).css('background-color', 'red');
        } 
    });

$('tr[class^=child-]').find('td > div, td').hide();

JSFiddle test

Answer 4

根据jQuery website，您将not与其元素后代一起使用以附加该事件！试试这个

 $('tr.parent *').not('select')
.css("cursor", "pointer")
.click(function (e) {
        // do something
   }
}

PS：这可能会多次将事件附加到另一个后代

中包含的元素

排除选择单击通过Jquery

4 个答案: