Question

我在表单中有2个复选框，这两个复选框都包含在form中。

对于form中的一个，我添加了属性autocomplete="off" 以下是代码段

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head></head>
    <body>
        <form name="chkBoxForm" >
            <div>
                <input type="checkbox" value="100" name="product"/>My Checkbox1
            </div>
        </form>
        <form name="chkBoxForm" autocomplete="off">
            <div>
                <input type="checkbox" value="200" name="product"/>My Checkbox2                         
            </div>
        </form>
    </body>
</html>

现在我的问题是，如果我们手动检查这些复选框，如果我们按 F5 ，则取消选中属性autocomplete="off"的复选框。但是仍然检查没有该属性的复选框。这种情况发生在FireFox 22中。

此行为因浏览器而异在IE中，两个复选框都保持选中状态，而在Chrome中，两个复选框都未选中。

但是当我在地址栏中按Enter键时，它会在所有浏览器中取消选中。

当我们按 F5 时，有人可以告诉我如何取消选中这些复选框吗？我知道这可以通过Javascript来处理。

还有其他html方法可以解决这个问题吗？

Answer 1

不，简单的HTML没有办法。 Javascript可能是您目前唯一的解决方案..

循环遍历javascript中的所有复选框并将其设置为取消选中：

var checkboxes = document.getElementsByTagName('input');

for (var i=0; i<checkboxes.length; i++)  {
  if (checkboxes[i].type == 'checkbox')   {
    checkboxes[i].checked = false;
  }
}

将它包装在一个onload监听器中，然后你就可以了：）

Answer 2

的jQuery

$('input[type=checkbox]').removeAttr('checked');

或者

<!-- checked -->
<input type='checkbox' name='foo' value='bar' checked=''/> 

<!-- unchecked -->
<input type='checkbox' class='inputUncheck' name='foo' value='bar' checked=''/> 
<input type='checkbox' class='inputUncheck' name='foo' value='bar'/>

+

$('input.inputUncheck').removeAttr('checked');

Answer 3

如果你有一个带有id的复选框checkbox_id。你可以用JS prop('checked', false)或prop('checked', true)

设置其状态

 $('#checkbox_id').prop('checked', false);

Answer 4

想到一个快速解决方案： -

<input type="checkbox" id="markitem" name="markitem" value="1" onchange="GetMarkedItems(1)">
<label for="markitem" style="position:absolute; top:1px; left:165px;">&nbsp</label>
<!-- Fire the below javascript everytime the page reloads -->
<script type=text/javascript>
  document.getElementById("markitem").checked = false;
</script>
<!-- Tested on Latest FF, Chrome, Opera and IE. -->

Answer 5

这是浏览器特定的行为，是一种让用户更方便填写表单的方法（比如在遇到错误时重新加载页面而不会丢失他们刚输入的内容）。因此，除了使用javascript在页面加载上设置默认值之外，没有确定的方法可以跨浏览器禁用此功能。

Firefox虽然似乎在您指定标题时禁用此功能：

Cache-Control: no-store

请参阅此question。

Answer 6

一种简单的方法，只有HTML，没有javascript，没有jQuery

<input name="box1" type="hidden"   value="0" />
<input name="box1" type="checkbox" value="1" />

Answer 7

嗯，我想你可以使用checked =“false”。这是取消选中复选框的html方法。您可以参考http://www.w3schools.com/jsref/dom_obj_checkbox.asp。

如何在默认情况下取消选中此复选框

7 个答案: