js 提交表单前强制要求所有内容填写后才可以提交

Question

想在提交表单前做检查，检查每个 select 选项卡是否都勾选了大于0的值
还有几个 input text的文本框是否都填写内容了

如果都填写才可以给予提交表单
否则最好能提示是哪个表单（可以用样式的方式 将该选项框或文本框的边框变成红色）

求详细的例子，谢谢啦

好的再加分，真的很感谢啦

Answer 1

页面样式问题，刚一开始不会没关系，慢慢来，谁都有这个过程。
下面是一个简单的代码，希望能帮到你。

css部分:
<style type="text/css">
.errstyle {border:1px solid red;}
.bor {border:1px solid #C0C0C0;}
</style>

js部分:
<script type="text/javascript">
//检查select
function checkSelect(obj) {
var val = obj.value;
if(val == "0") {
obj.className = "errstyle";
return false;
} else {
return true;
}
}
//检查input
function checkInput(obj) {
var val = obj.value;
//这个地方需要处理一下空格，具体的方法不写了。
if(val == "") {
obj.className = "errstyle";
return false;
} else {
return true;
}
}
//获取焦点时清除错误
function clearerr(obj) {
if(obj.className = "errstyle") {
obj.className = "bor";
}
}
//提交校验
function dosubmit() {
var select1 = checkSelect(document.getElementById('select1'));
var select2 = checkSelect(document.getElementById('select2'));
var input1 = checkInput(document.getElementById('input1'));
var input2 = checkInput(document.getElementById('input2'));

if(select1 && select2 && input1 && input2) {
//提交表单代码
alert("验证通过可以提交表单");
} else {
alert("验证不通过不能提交");
}
}
</script>

页面部分：
<form id="myform" name="myform" method="post" action=''>
<p>select1：
<select id="select1" name="select1" class="bor" onfocus="clearerr(this);">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="4">4</option>
</select>
</p>
<p>select2：
<select id="select2" name="select2" class="bor" onfocus="clearerr(this);">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="4">4</option>
</select>
</p>
<p>input1：<input type="text" id="input1" name="input1" value="" class="bor" onfocus="clearerr(this);"></p>
<p>input2：<input type="text" id="input2" name="input2" value="" class="bor" onfocus="clearerr(this);"></p>
<input type="button" onclick="dosubmit();" value="提交"/>
</form>

Answer 2

最好的办法就是提交之后交给框架的validata来处理，
如果是JS来处理，比如你是要填好了再把提交按钮变成可用，可以在每一个input的onchange（）中做处理check。
如果没有提交按钮可用状态的变化的话，只需要在onclick事件check。
给分吧匿名兄

Answer 3

手机不好打字，给个思路
1、写一个检查函数，举例命名为 check() 。这个函数逐一检查表单元素，不符合则修改这个元素的样式，并返回false，符合则返回true
2、在提交按钮上添加onclick事件，如 onclick="return check()" ，这样的话，如果检查函数返回false ，则不会提交

Answer 4

这都七老八十的需求了，稍稍会点js的都会，如果你只想要简单的，用@恋米无言的思路，要用好的，就用插件，验证插件，可有搜到很多，我一直在用的是jquery.validationEngine.min.js，用法上网上搜，只需在字段class中加入验证格式，加载form validationEngine就可以了。

Answer 5

可见你连最基本的知识还没学会，写给你也是白写啊兄弟