如果未选中代码中的复选框，则调用onchange函数

Question

I'm using pure javascript. There's a checkbox with a function attached to it when "onchange" event occurs.

I want to call that function, when I check and uncheck it from the javascript code.

It gets checked and unchecked but that function is not called unless I do it from manually by keyboard arrow keys.

Is there any way to make that function get called ?

HTML DOM :

<input type="checkbox" onchange="hello();" id="myCheckBox">

Javascript:

document.getElementById("myCheckBox").checked = true;

Answer 1

The 'onchange' event is for use in text boxes and selection lists, try the 'onclick' event.

To fire an event from code you might find this useful:

How to trigger event in JavaScript?

Answer 2

Invoke the handler function when your JavaScript code changes the state of the checkbox elements.

 function toggle() { document.getElementById("myCheckBox").checked = !document.getElementById("myCheckBox").checked; hello(); //invoke the function here! } function hello() { alert(document.getElementById("myCheckBox").checked) } 

 <input type="checkbox" onchange="hello();" id="myCheckBox"> <button onclick='toggle()'>Toggle</button> 

Answer 3

Use this:

HTMLInputElement.prototype.check = function() {
  if (this.checked !== null) {
    this.checked = true;
    this.onchange();
  }
};

HTMLInputElement.prototype.uncheck = function() {
  if (this.checked !== null) {
    this.checked = false;
    this.onchange();
  }
};

document.getElementById("myCheckBox").check();