我正在尝试使用复选框来清除表单,但我不希望重置来清除复选框本身。我使用的代码如下:
<input name="no_cage" id="no_cage" type="checkbox" value="1" onclick="this.form.reset();">
当我单击复选框时,它会很好地清除表单,但不幸的是,它也会清除自身。
该复选框还会更新数据库,如果选中,则更新为 1;如果未选中,则更新为 0。所以我需要在表单中使用它,并且它需要能够在选中和未选中之间切换。
有两种方法可以做到这一点:
创建一个 javascript 函数来重置表单,然后再次选中该复选框为 true。
使用 JQuery:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).on('change', '#no_cage', function() {
if(this.checked) {
document.getElementById("client").reset();
this.checked = true;
}
});
</script>
<form id="client">
<input type="text">
<input id="no_cage" type="checkbox" value="1"> CLEAR
</form>
使用 JavaScript:
<script type="text/javascript">
function clearform(){
if (document.getElementById("no_cage").checked == true){
document.getElementById("client").reset();
document.getElementById("no_cage").checked = true;
}
}
</script>
<form id="client">
<input type="text">
<input id="no_cage" type="checkbox" onclick="javascript:clearform();"> CLEAR
</form>
或者,
将复选框保留在表单之外
<script type="text/javascript">
function clearform(){
document.getElementById("client").reset();
}
</script>
<form id="client">
<input type="text">
</form>
<input id="no_cage" type="checkbox" value="1" onclick="javascript:clearform();"> CLEAR
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)