如何根据复选框的状态使用Javascript更改隐藏输入的值？

Question

我试图更改隐藏输入字段的值,具体取决于复选框的值.我对Javascript了解不多,但这是我到目前为止所做的.

<input type="hidden" value="" id="delterms" name="O_" />
<input type="checkbox" id="checkbox" onchange="terms()" />
<script type="text/javascript">
 var checked = document.getElementById('checkbox').checked;
  function terms() {
   if (checked==false)
    {
     document.getElementById('delterms').value=''
    }
   else
    {
    document.getElementById('delterms').value='Accepted'
    }
}
</script>

我让它工作,但只在第一次点击,无论如何根据复选框状态设置值？我怀疑有一些更简单的方法,我毫无疑问会使问题复杂化.

Answer 1

尝试添加一个事件监听器,而不是使用HTML"onchange"属性,这可能会为您澄清一些事情,并且可能会使您的代码在长期运行中更容易维护:

<input type="hidden" id="delterms" value="" name="O_" />
<input type="checkbox" id="checkbox" />
<script type="text/javascript">
  var checkbox = document.getElementById('checkbox')
    , hidden = document.getElementById('delterms');
  checkbox.addEventListener('change', function() {
    hidden.value = (this.checked) ? 'Accepted' : '';
  }, false);
</script>

这个想法是每次用户单击复选框时都会运行匿名函数,这会将隐藏字段的值设置为"已接受"或空字符串,具体取决于是否选中该复选框.

这个jsFiddle显示了一个工作示例.