只提交是复选框被选中
only submit is check box is checked
<div id="checkbox">
<input type="checkbox" id="1" name="1"/><br/>
<input type="checkbox" id="2" name="2"/><br/>
<input type="checkbox" id="3" name="3"/><br/>
<input type="submit" value="Create"/>
</div>
我有上面的代码,需要某种类型的检查,使表单只提交,如果至少一个框被选中,也不会提交,如果2个框被选中,所以只有检查,以确保1被选中。
多谢
如果您想让用户选择一个或多个值,那么使用Checkbox是有意义的。我推荐你使用单选按钮
使用单选按钮代替复选框,并给它们都起相同的名字。然后不要使用javascript
使用单选按钮
<div id="checkbox">
<input type="radio" id="1" name="radio_button"/><br/>
<input type="radio" id="2" name="radio_button"/><br/>
<input type="radio" id="3" name="radio_button"/><br/>
<input type="submit" value="Create"/>
</div>
我建议使用单选按钮组。你可以参考这个参考
单选按钮,你不需要使用javascript。但是如果你坚持使用复选框,使用javascript是一个解决方案。
为什么不直接使用单选按钮呢?或者在这个复选框上添加一个类(如果你想要复选框),然后取消选中所有的onClick
使用Javascript函数:
<script>
function checkifclicked()
{
//alert($('input[name=cb]').val());
var checkboxs=document.getElementsByName("cb");
var okay=false;
for(var i=0,l=checkboxs.length;i<l;i++)
{
if(checkboxs[i].checked)
{
okay=true;
}
}
if(!okay){
alert("Please check a checkbox");
return false;
}
}
</script>
<form name="send_email" id="send_email" action="send_email.php" onSubmit="return checkifclicked()" method="post">
<div id="checkbox">
<input type="checkbox" id="1" name="cb"/><br/>
<input type="checkbox" id="2" name="cb"/><br/>
<input type="checkbox" id="3" name="cb"/><br/>
<input type="submit" value="Submit"/>
</div>
</form>
演示>>
如果只选中其中一个,则应该使用单选按钮。
<div id="checkbox">
<input type="radio" id="1" name="somename"/>Label1<br/>
<input type="radio" id="2" name="somename"/>Label2<br/>
<input type="radio" id="3" name="somename"/>Label3<br/>
<input type="submit" value="Create"/>
</div>
http://jsfiddle.net/WHDFt/您还需要确保选中了其中一个。这里有一些解决方案。
进行默认检查。例如,您可以默认选中第一个无线电。不可能取消选中单选按钮,所以总是会有选中的字段。
你可以在提交表单时使用JavaScript验证。
给出提交按钮的id,例如:
<input id="submit" type="submit" value="Create"/>
js代码:
$(function(){
$('#submit').click(function(){
if($('#checkbox input:checked')){
return true;
}
return false;
});
});
但是使用多重选择对你来说是更好的主意
if(document.getElementById('1').checked || document.getElementById('2').checked || document.getElementById('3').checked)
{
if((document.getElementById('1').checked && document.getElementById('2').checked ) || (document.getElementById('2').checked && document.getElementById('3').checked ) || (document.getElementById('1').checked && document.getElementById('3').checked ))
{
return false;
}
else
{
//dosomthing
}
}
相关文章:
- Jquery表单验证插件-如果选中复选框,如何在提交时执行某些操作
- 如何获取所有选中复选框的所有值,然后将其提交到表单中
- 使用javascript提交表单并从字段/单选框/复选框/文本区域获取数据
- ASP MVC复选框表单提交问题
- 如何在将鼠标悬停在提交/锚点上时检查复选框是否已选中,并显示提示用户这样做的警报
- Rails 4:动态添加的复选框未提交
- 高级表单提交-单选、复选框和重定向
- 如何在提交时验证多个复选框
- 提交前验证超链接和复选框
- 为什么复选框在未选中时不提交任何数据
- 如何提交未选中复选框的值
- 如何使用javascript自动提交保存/重新填充的复选框
- 如何在提交时防止粘性复选框重置?(一页上有多个表格)
- HTML5/Javascript验证复选框提交URL重定向
- 使用复选框提交表单
- 使用复选框提交表单
- 使未选中的HTML复选框提交选中的值
- 通过取消选中复选框提交表单
- 可以't使用jQuery+Rails点击复选框提交表单
- Yahoo YUI2 datatable复选框提交