JavascriptcheckboxonChange

我有一个表单中的checkbox，我希望它按照以下情况工作：

如果有人检查它，textfield（ totalCost ）的值应该被设置为10 。 然后，如果我回去取消选中，则函数calculate()将根据表单中的其他参数设置totalCost的值。

所以基本上，我需要的地方，当我检查checkbox，我做了一件事，当我取消选中，我做了另一个。

Answer 1

 function calc() { if (document.getElementById('xxx').checked) { document.getElementById('totalCost').value = 10; } else { calculate(); } } 

HTML

 <input type="checkbox" id="xxx" name="xxx" onclick="calc();"/> 

Answer 2

使用onclick事件，因为每当点击一个checkbox实际上改变它。

Answer 3

如果你正在使用jQuery ..那么我可以build议如下：注意：我在这里做了一些假设

 $('#my_checkbox').click(function(){ if($(this).is(':checked')){ $('input[name="totalCost"]').val(10); } else { calculate(); } }); 

Answer 4

以下解决scheme使用jQuery。 假设您有一个checkbox，其ID为checkboxId 。

 var checkbox = $("#checkboxId"); checkbox.change(function(event) { var checkbox = event.target; if (checkbox.checked) { //Checkbox has been checked } else { //Checkbox has been unchecked } }); 

Answer 5

通过它的id引用checkbox，而不是用＃将onclick属性赋值，而不是使用change属性

 var checkbox = $("save_" + fieldName); checkbox.onclick = function(event) { var checkbox = event.target; if (checkbox.checked) { //Checkbox has been checked } else { //Checkbox has been unchecked } }; 

Answer 6

使用Javascript

  // on toggle method // to check status of checkbox function onToggle() { // check if checkbox is checked if (document.querySelector('#my-checkbox').checked) { // if checked console.log('checked'); } else { // if unchecked console.log('unchecked'); } } 

HTML

<input id="my-checkbox" type="checkbox" onclick="onToggle()">