单选按钮和多选按钮在实际应用中,通常会有如下情况:
<input type="radio" value="1" name="group[1]" />
<input type="radio" value="2" name="group[1]" />
<input type="radio" value="3" name="group[1]" />
<input type="radio" value="4" name="group[1]" />
<input type="radio" value="11" name="group[2]" />
<input type="radio" value="21" name="group[2]" />
<input type="radio" value="31" name="group[2]" />
<input type="radio" value="41" name="group[2]" />
<input type="checkbox" value="1" name="ch[1][]" />
<input type="checkbox" value="2" name="ch[1][]" />
<input type="checkbox" value="3" name="ch[1][]" />
好就这三组吧,现在如果我们需要判断每一组起码有一个选中,以证明用户提交的表单是合法有效的,
如果你想用JQuery解决,我也这么想,不过貌似没有好的解决办法,
你可能会想到 $(":radio[@name=name]") 这样,但由于实际运用时,name常常是含有中括号[]的,所以根本就检索不到表单元素,即使你这样:
$("input[@name='name']") 也一样,(可以用name='group[1]'代入试试看)
后来发现,其实不必,可以使用 dom原生支持的方法:document.getElementsByName()
在多个元素name 相同时,返回一个对象数组,非常好用。
这样就容易多了,可以把不同name的元素划分为一起,方便判断。
下面释放一下我的一段关于判断所有必答题都已经回答的检测代码:
function check_required()
{
var valid = true;
var required=new Array;
$(".required").each(function(){
var tmp=this.name;
if(jQuery.inArray(tmp, required)==-1){
required.push(tmp);
var objs=document.getElementsByName(tmp);
var sg=false;
for(var i=0; i < objs.length; i++){
if(objs[i].type=="radio" || objs[i].type=="checkbox"){
if(objs[i].checked) sg=true;
}else{
if(objs[i].value!='') sg=true;
}
}
if(!sg) valid=sg;
}
});
if(!valid)alert("请完成必答题");
return valid;
}
原理就是给所有的必答题的<input元素加上class为 required,然后进行判断,如果您有相同的需求,可以借鉴一下这里的方法,个人认为实现的还是比较好。