排除選擇通過jquery點擊

Question

我試圖觸發一個動作，當我點擊一個父類的tr上的任何地方。不包括當我點擊其中一個下拉框時。

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

我試着以下，但這是行不通的。

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

Answer 1

這應該解決的問題是Chrome和火狐瀏覽器：

$('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 2

試試這個：

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

Answer 3

按照jQuery website，你會使用not與之元素子孫附加該事件！ 嘗試此

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

PS：這可能附着事件不止一次地包含在另一個後裔

Answer 4

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 
     } 
    });