felix001 felix001 - 7 months ago 21
Javascript Question

Exclude Select Click via Jquery

Im trying to trigger an action when I click anywhere on a tr with a class of parent. Excluding when I click on one of the dropdown boxes.

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


Im trying the following but this is not working.

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

Answer

This should solve the issue for both Chrome and 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

Edit: Simplified version if you don't need to do any action when the select is clicked.

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