对 html 表单上的复选框选中或未选中事件执行操作 [英] Perform an action on checkbox checked or unchecked event on html form

问题描述

我在表单上有一个复选框，它照常默认未选中.现在我想对这个复选框的选中和未选中状态执行两个单独的操作.

I have a checkbox on a form which is unchecked by default as usual. Now I want to perform two separated actions on the checked and unchecked state of this checkbox.

这是我的复选框:

<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');
  }
}

它只是未经检查就发出警报！这样做的最佳方法是什么?

It just alerts unchecked! What is the best way to do this?

推荐答案

我们可以使用 JavaScript 做到这一点，不需要 jQuery.只需传递更改的元素并让 JavaScript 处理它.

We can do this using JavaScript, no need of jQuery. Just pass the changed element and let JavaScript handle it.

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");
  }
}

此处演示

这篇关于对 html 表单上的复选框选中或未选中事件执行操作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！