Detect checkbox click/change event in Chrome 93 for desktop-CodePudding

This code:

<div >
    <input  type="checkbox" role="switch" id="switchService">
    <label  for="switchService">Service</label>
</div>

$("#switchService").on('click', function() {
    alert($(this).is(':checked'));
});

works in Firefox and in Chrome for Android. But in Firefox 93 for Desktop (Windows 7) does not trigger the event.

I also tried a lot of different syntaxes like:

$("#switchService").on('click', function() {
$("#switchService").on('change', function() {
$("#switchService").change(function() {

All of the above works in all browsers I tried but the Chrome 93 for desktop.

Is there a specific syntax for it? Of course javascript is enabled, as other scripts work fine.

CodePudding user response：

You can avoid the "race-condition"-type difficulties mentioned by @RoryMcCrossan if you use event delegation like shown here:

$("body").on("click","#switchService",  function() { ... })
         .on("change","#switchService", function() { ... })
         .on("change","#switchService", function() { ... });