.change() in jquery not working?

Question

I have three check boxes I want to make mutually exclusive. I have written the following code:

window.jQuery && jQuery(window.parent.document).ready(function() {
$('#id1,#id2,#id3').live('change', function(){
if ($this.prop('checked', true))
$('#id1,#id2,#id3').not(this).prop('checked', false)
})});

I have placed this code at the very bottom of the page. I have checked the solutions offered in: HTML <select> JQuery .change not working

I receive no error messages in console before or after pressing the check boxes, it just doesn't seem to work.

Do I need to create a separate function and attach it to an "onchange" event for the check boxes in the HTML code?

Possible duplicate of [.live() vs .on() method](https://stackoverflow.com/questions/9215237/live-vs-on-method) — Carsten Løvbo Andersen, Nov 26 '17 at 16:08
@Carsten Løvbo Andersen Thank you, but the result is the same. It still doesn't work, and there are still no error messages in the console. — Nimrod Yanai, Nov 26 '17 at 16:13
try adding `console.log()` statement inside the `ready()` function to verify if it is finding jquery and binding the `.change()` function — Muhammad Omer Aslam, Nov 26 '17 at 16:17
@Muhammad Omer Aslam If it wouldn't have recognized jquery wouldn't it have thrown an error message that $ is not defined? — Nimrod Yanai, Nov 26 '17 at 16:34
No i recon that it wont reach there if `window.jQuery` fails , you are using ternary operator for calling the `.ready` , as `someMethod() && someOtherMethod()` , the `someOtherMethod()` will be called only if `someMethod()` return `true` — Muhammad Omer Aslam, Nov 26 '17 at 16:36
Thanx. I never actually used console.log before. Would I add it like this: window.jQuery && jQuery(window.parent.document).ready(console.log, function(){ ? — Nimrod Yanai, Nov 26 '17 at 16:42

score 1 · Accepted Answer · answered Nov 26 '17 at 18:58

Try this:

$('#id1, #id2, #id3').on('change', function() {
  console.log("Changed one!");
  if ($(this).prop('checked', true)) {
    $('#id1,#id2,#id3').not(this).prop('checked', false);
  }
});

You were missing curly brackets following your if statement, and I changed $this to $(this).

Here's a working fiddle: https://jsfiddle.net/o7wptoca/3/

.change() in jquery not working?

1 Answers1