I am trying to use html radio input with this code:

function change(e) {
  console.log(e.target.value, e.target.checked);
}

<label><input type="radio" name="test" onchange="change(event)" value="sel1"> radio 1</label>
<label><input type="radio" name="test" onchange="change(event)" value="sel2"> radio 2</label>

I am trying to use html radio input with this code:

function change(e) {
  console.log(e.target.value, e.target.checked);
}

<label><input type="radio" name="test" onchange="change(event)" value="sel1"> radio 1</label>
<label><input type="radio" name="test" onchange="change(event)" value="sel2"> radio 2</label>

what I expect is that on change selection the change function is called 2 times, 1 for unchecked and 1 for checked, instead is called only one time. Is it the correct behavior? how can I get the expected? In this way, what is the difference between on change and on click?

I tryied with edge/chrome

• html

• 2 I think you want the input event: developer.mozilla./en-US/docs/Web/API/Element/input_event. It fires on every change. – Poul Bak Commented Jan 29 at 19:19
• uff... i see this is a duplicate question: stackoverflow/q/11173685/854279