I've written some jQuery code like this:
$('#checkbox').click(function() {
// do stuff
});
function myFunction() {
$('#checkbox').click();
}
The desired behavior here is for the checkbox click handler to be invoked when myFunction executes. However, the behavior I observe is that the click handler runs and the checkbox is toggled. How can I run the click handler without toggling the checkbox?
$('#checkbox').triggerHandler("click");
Or make your click handler a function that you can call directly.
You should invoke a method when the checkbox is changed so you can call the same method outside of the click event:
$('#checkbox').change(function() {
someMethod();
});
function myFunction(){
someMethod();
}
How about you do the processing in the function and have the click handler invoke the function:
function myFunction() {
// do stuff
}
$('#checkbox').click(function() {
myFunction()
});
Try like this:
$('#checkbox').click(function(event) {
event.preventDefault();
// do stuff
});
See working demo
Another option to differentiate when called from myFunction() or not:
$('#checkbox').click(function(event, caller) {
if (caller == 'MF') {
event.preventDefault();
}
// do stuff
$(this).parent().append('<span>It wasn\'t checked</span><br>');
});
function myFunction() {
$('#checkbox').trigger('click', ['MF']);
}
$('#clk').on('click', myFunction );
See working demo
.preventDefault() conditionally then, but the OP has not specify what that condition would be..
.change().