如何在jQuery子选择器中使用event.target？

Question

I want to check if a child-element of a clicked div has a certain class.

So i do this:

$('.panel').on('click', function (event) { if($(".panel input").hasClass('h5_validator_error')) { event.stopPropagation(); } });

The problem: I have more then one .panel class. Since my whole site gets generated by the user and json-files, i need a dynamic environment without ids .

So, actually my if-statement is preventing all .panel -clicks from doing their job.

I want to do something like this:

if($(event.target + ".panel input").hasClass('h5_validator_error')) { event.stopPropagation(); }

So i want to select all input - elements from the clicked div without having an array and loop through it.

Is this possible? Or what is the most efficient way of selecting child-elements of the clicked one?

Answer 1

You should rather use this to get the targeted element:

$(this).find("input").hasClass('h5_validator_error');

or

$('input',this).hasClass('h5_validator_error');

Answer 2

You shoud make the dom object $(event.target) and then apply the jquery method on it.

Try this:

$('.panel').on('click', function (event) {
    if($(event.target).find('input').hasClass('h5_validator_error')){
      alert('true');
    }
    else{
      alert('false');
    }
});

Working Example