文章来自:https://blog.csdn.net/qq_38215042/article/details/84675988
具体代码如下所述:
if(条件语句){
return false;
}else{
return true;
}
if(条件语句){
return false;
}else{
return true;
}
if(条件语句){
return false;
}else{
return true;
}
你写的是不是上面这种情况?其实会出现只执行了第一个这种情况,主要是你在if else语句中都加入了,return 用来返回结果,这种方式其实是没有错的,逻辑也很通顺,不过你仔细想一想,你提交的时候如果返回的是true的话,那么你的form表单就相当于收到了一个可以提交的命令,那么他就会进行表单提交,后面的if else语句就不会执行了。
解决的方法:我用的是一种标记,先全部给他们true,如果后面的if语句条件判断为false,就弹出一个弹框进行提示,直到全部都符合条件了,才会给form表单返回一个true.进行表单提交。
有好的方法欢迎评论呦~~~~~~~~~
1:js代码
需要引入jquery
< type=\"text/ \">
function checkForm() {
var productName = true;
var chanDi = true;
var muChanLiang = true;
var zongChanLiang = true;
var xiangQiang = true;
var yuShouJia = true;
var phone = true;
var pattern = /^1[34578]\\d{9}$/; //验证手机号正则表达式
if ($(\"#userName\") == \"\") {
alert(\"请输入产品名称!\");
/* alert($(\"#gsp_add_img_23\").val()); */
productName = false;
} else if ($(\"#candi\").val() == \"\") {
alert(\"请输入产地!\");
chanDi = false;
} else if ($(\"#muchan\").val() == \"\") {
alert(\"请输入亩产量!\");
muChanLiang = false;
}else if ($(\"#zongChan\").val() == \"\") {
alert(\"请输入总产量!\");
zongChanLiang = false;
} else if ($(\"#xiangqing\").val() == \"\") {
alert(\"请输入产品详情!\");
xiangQiang = false;
} else if ($(\"#yushoujia\").val() == \"\") {
alert(\"请输入预售价!\");
yuShouJia = false;
} else if (!pattern.test($(\"#userPhone\").val())) {
alert(\"手机号格式错误\");
phone = false;
}
if (productName == true && chanDi == true && muChanLiang == true &&
zongChanLiang == true && xiangQiang == true && yuShouJia == true && phone == true) {
$(\"#ListForm\").submit();
}
}
</ >
2:form表单
<form action=\"$!webPath/new/fl_npsh.htm\" method=\"post\" name=\"ListForm\"
id=\"ListForm\" enctype=\"multipart/form-data\" >
<!-- 类似首页楼层模块 -->
<div style=\"width: 1020px; margin: 0 auto;\">
<div class=\"floor floor_purple\"
style=\"width: 1011px; border-top: 1px solid #eee;\">
<div class=\"liebiao\"
<!-- 给后台传一个id -->
<input name=\"id\" type=\"hidden\" id=\"id\" value=\"$!obj.id\" />
</div>
<div class=\"liebiao\">
<!-- <span class=\"liebiao_left\" style=\"color:red\">*</span> -->
<span class=\"liebiao_left\">产品名称:</span> <input id=\"userName\"
type=\"text\" name=\"product_name\" class=\"shuruk\"
placeholder=\"例:灵宝SOD苹果(*必填项 *)\" />
</div>
<div class=\"liebiao\">
<span class=\"liebiao_left\">产品产地:</span> <input type=\"text\"
value=\"\" name=\"product_origin\" class=\"shuruk\" id=\"candi\"
placeholder=\"例:灵宝寺河山(*必填项 *)\" />
</div>
<div class=\"liebiao\">
<span class=\"liebiao_left\">产品亩产量:</span> <input type=\"text\"
value=\"\" name=\"mu_yield\" class=\"shuruk\" id=\"muchan\"
placeholder=\"例:每亩产量(*必填项 *)\" />
</div>
<div class=\"liebiao\">
<span class=\"liebiao_left\">产品总产量:</span> <input type=\"text\"
value=\"\" name=\"sum_yield\" class=\"shuruk\"
placeholder=\"例:总产量(*必填项 *)\" id = \'zongChan\'/>
</div>
<div class=\"liebiao\" style=\"height: 60px;\">
<span class=\"liebiao_left\"
style=\"display: inline-block; height: 60px; line-height: 30px; float: left;\">产品详情:</span>
<textarea type=\"text\" value=\"\" id=\"xiangqing\"
name=\"product_details\" class=\"shuruk02\"
placeholder=\"例:产品种植标准、产品优点、产品性能、储存注意事项等(*必填项 *)\"></textarea>
</div>
<div class=\"liebiao\">
<span class=\"liebiao_left\">产品预售参考价:</span> <input type=\"text\"
value=\"\" id=\"yushoujia\" name=\"advance_price\" class=\"shuruk\"
placeholder=\"例:以每500g为单位(*必填项 *)\" />
</div>
<div class=\"liebiao\">
<span class=\"liebiao_left\">站主联系方式:</span> <input id=\"userPhone\"
value=\"\" name=\"phone\" class=\"shuruk\"
placeholder=\"(*必填项 *)\" />
</div>
<div class=\"liebiao\" style=\"margin-top: 30px;\">
<input type=\"button\" value=\"立即申请\" class=\"tijiao\" =\"checkForm()\">
</div>
</div>
</div>
</form>
总结
以上所述是小编给大家介绍的解决JS表单验证只有第一个IF起作用的问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
继续阅读与本文标签相同的文章
-
Docker容器实战(一) - 封神Server端技术
2026-05-19栏目: 教程
-
Confluence 6.15 博客页面(Blog Posts)宏
2026-05-19栏目: 教程
-
Confluence 6.15 修改历史(Change-History)宏
2026-05-19栏目: 教程
-
SpringBoot2 整合 Dubbo框架 ,实现RPC服务远程调用
2026-05-19栏目: 教程
-
企业为什么要“多”申请专利?
2026-05-19栏目: 教程
