简体   繁体   中英

How can I exclude an element class from being a target in jquery .click() event?

I've searched around the net for an answer to this, but no cigar, so here is my issue.

I have two HTML divs; both contained in a wrapper div, but one has z-index:101 in it's CSS, along with width and height 100%. This, naturally, places it "over" (z-index wise) the other div, .object, when a jquery click event is fired. This causes this overlay div to be the click's e.target, but I need to have the .object class be the target. Thus, it is possible (and if so, how) to exclude an HTML element from a jquery click event?

For reference, the jquery click event code I'm using:

$(document).click(function(e) {
            if(e.target.parentNode.parentNode.classList.contains("object")) {
                globalSelected.classList.remove('selected') ;
                globalSelected=e.target.parentNode.parentNode;
                globalSelected.classList.add('selected') ;
            } else {
                globalSelected.classList.remove('selected') ;
                globalSelected=null;
            }
});
$('.overlay').on('click', function() {
  $(this).siblings('.object').trigger('click');
});

Without more context, I'm not sure if this will cause any undesirable side-effects.

I actually found the solution to my own question mere minutes after posting the question, despite having googled for hours beforehand. I merely needed to add pointer-events:none; to the CSS of the overlay.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM