重庆分公司,新征程启航
为企业提供网站建设、域名注册、服务器等服务
在项目开发中,遇到这样一个问题,网页中有多组单选问题和复选项,甚至还有下拉列表或文本输入框……除了text文本输入框可以给它添加required属性外之外,其他都不能用html自带的属性来实现必选的功能。于是从网上搜索了相关的检测方法,大致方式都是这样:
var radio = document.getElementsByName("question");
for (i=0; i
alert(radio[i].value)
}
}
但是这只是针对一组单选问题的解决办法,当有多组单选问题的时候,就无法保证每个问题都能被检测到已被选中。因为我的页面是这样的结构:
成都创新互联专业为企业提供三水网站建设、三水做网站、三水网站设计、三水网站制作等企业网站建设、网页设计与制作、三水企业网站模板建站服务,10年三水做网站经验,不只是建网站,更提供有价值的思路和整体网络服务。
$('form').on('submit',function(){
var num = $('div.high_light').length;//总数
if(num > do_qid){
alert('你好像没做完,再去检查下吧!');
return false;
}else{
return true;
}
});
也许这个算是“耍小聪明”吧,但的确能够解决检测的困难,但如果用户并没有通过鼠标点击选择问题的选项,而是通过键盘完成的,那么就会出现“明明做完了,网页仍然提示没完成”的错误判断。
虽然,这个只是个小瑕疵,临时用它来解决了我的项目问题。但我还是希望能够彻底解决它。也许这个问题对于大牛来说根本不是问题,但我的确花了一整晚来思考它,最后终于解决了,实现代码如下:
$('form').on('submit',function(){
if(submit_check()){
$('input[type="submit"]').addClass('disabled').val('正在提交,请等待...');
return true;
}else{
alert('你好像没做完,再去检查下吧!');
return false;
}
});
function submit_check(){
$.each($('.choice_body'),function(index,fn){
var type = $(fn).find('input').attr('type');
if(type == 'radio' || type == 'checkbox'){
var input_val = $(fn).find('input:checked').val();
if(input_val){
console.log(index,input_val);
}else{
return false;
}
}
});
return true;
}
_______________________________
新手瞎折腾,大神见笑了~!欢迎指点更好的解决方法哦~!