JQuery click only fires one action
-
29-06-2021 - |
Question
Can anyone help me understand why this is not working?
<div id="css-check" class="css-check tool-tip checkbox inline" ...
<input id="someid" name="somename" type="checkbox" value="somevalue" />
</div>
$('.css-check').bind({
click: function() {
$(this).toggleClass('clicked');
this.children[0].click();
},
mouseenter: function() {
// do something on mouseenter
}
});
Only the first action is taken. So, the class is toggled but the checkbox, that is the [0] child of the div, is not clicked.
EDIT
This works.
var $checkbox = $(this).children('input:first-child');
$checkbox.prop('checked', !$checkbox[0].checked);
$(this).toggleClass('clicked');
Solution
change:
this.children[0].click();
to:
$(this).children('input:first-child').click();
Note: this triggers the click event, if you want to check the checkbox then use:
$(this).children('input:first-child').attr('checked', 'true');
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow