在html表单上对复选框选中或未选中的事件执行操作

Question

我在表单上有一个复选框,默认情况下会像往常一样取消选中.现在我想在此复选框的已选中和未选中状态下执行两个单独的操作.

这是我的复选框:

<form>
    syn<input type="checkbox" name="checkfield" id="g01-01"  onchange="doalert(this.id)"/>
</form>

这是我的脚本:

function doalert(id){
  if(this.checked) {
     alert('checked');
  }else{
     alert('unchecked');
  }
}

它只是警告未经检查!什么是最好的方法.

Answer 1

我们可以使用JavaScript,不需要jQuery.只需传递已更改的元素,让JavaScript处理它.

HTML

<form id="myform">
    syn<input type="checkbox" name="checkfield" id="g01-01"  onchange="doalert(this)"/>
</form>

JS

function doalert(checkboxElem) {
  if (checkboxElem.checked) {
    alert ("hi");
  } else {
    alert ("bye");
  }
}

在这里演示