我在表单中有一个复选框,我希望它能按照以下场景工作:

如果有人检查它,文本字段(totalCost)的值应该设置为10。 然后,如果我返回并取消选中它,函数calculate()将根据表单中的其他参数设置totalCost的值。

基本上,我需要这样的部分,当我选中复选框时,我做一件事,当我不选中它时,我做另一件事。


当前回答

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

HTML

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

其他回答

HTML:

<input type="checkbox" onchange="handleChange(event)">

JS:

function handleChange(e) {
     const {checked} = e.target;
}

使用onclick事件,因为每次单击复选框都会改变它。

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()”>

下面的解决方案使用jquery。让我们假设您有一个id为checkboxId的复选框。

const checkbox = $("#checkboxId");

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

try

totalCost.value = checkbox.checked ? 10 : calculate();

函数更改(复选框){ totalCost。Value =复选框。检查?10:计算(); } 函数compute () { 返回other.value * 2; } 输入{显示:块} <input type=" Checkbox " onclick="change(this) "" / > 总成本:<input id="totalCost" type="number" value=5 /> Other: <input id=" Other " type="number" value=7 />