JQuery验证jsp页面属性是否为空(实例代码)


Posted in Javascript onNovember 08, 2013

说明:验证是否为空的前提首先要保证是在提交form之前验证的,如果验证结果有为空的项那么限制表单不能提交,并且提示验证错误信息,验证页面属性都不为空的情况下表单正常提交,这部分属于JS部分的东西,与后台业务逻辑层和控制层基本没有任何关系。

限制提交的方法可以是在form标签里限制,也可以是在submit按钮上添加onclick事件限制:

<form action=".." method="post" onsubmit="return check();">
<input type="submit" value="提交" onclick="return check()" >

案例:

<form action="./login.action" method="post" onsubmit="return check();">
<table>
<tr>
<td width="451"> </td>
<td width="378">
<table >
<tr>
<td width="60"> </td>
<td>
<font color="#000000">用户名:</font>
</td>
<td align="left"> <input name="userInfo.userName" id="userName" type="text">
<span id="checkUserName"></span> 
</td>
<tr> <td> </td>
<td align="right" nowrap>
<font color="#000000">密 码:</font>
</td>
<td align="left">
<input name="userInfo.password" id="password" type="password">
<span id="checkPassword"></span>
</td>
</tr>
<tr>
<td colspan="4" align="center" nowrap>
<input type="submit" id="btnLog" value=" 登 录 " >
   <input type="reset" value=" 重 置 ">
</td>
</tr>
</table>
</form>

<!--引入js文件 jquery-->
<script type="text/javascript" src="js/common/jquery-1.5.1.min.js"></script>
<script type="text/javascript">
function check(){
var userName=$("#userName").val();
var password=$("#password").val();
alert(userName);
alert(password);
if(userName==""){
$("#checkUserName").html("<font color='red'>用户名不能为空!</font>");
return false;
}
if(password==""){
$("#checkPassword").html("<font color='red'>密码不能为空!</font>");
return false;
}
return true;
}
</script>
Javascript 相关文章推荐
Jquery下的26个实用小技巧(jQuery tips, tricks &amp; solutions)
Mar 01 Javascript
jquery remove方法应用详解
Nov 22 Javascript
script标签属性用type还是language
Jan 21 Javascript
基于jQuery实现二级下拉菜单效果
Feb 01 Javascript
深入浅析JavaScript中的constructor
Apr 19 Javascript
JS实现保留n位小数的四舍五入问题示例
Aug 03 Javascript
jquery 删除节点 添加节点 找兄弟节点的简单实现
Dec 07 Javascript
微信小程序 数组中的push与concat的区别
Jan 05 Javascript
学习使用Bootstrap输入框、导航、分页等常用组件
May 11 Javascript
原生实现一个react-redux的代码示例
Jun 08 Javascript
从组件封装看Vue的作用域插槽的实现
Feb 12 Javascript
js实现div色块碰撞
Jan 16 Javascript
原生js做的手风琴效果的导航菜单
Nov 08 #Javascript
jquery 日期控件datepicker属性详细解析
Nov 08 #Javascript
jquery增加时编辑jqGrid(实例代码)
Nov 08 #Javascript
jqueyr判断checkbox组的选中(示例代码)
Nov 08 #Javascript
iframe子父页面调用js函数示例
Nov 07 #Javascript
Jquery通过Ajax方式来提交Form表单的具体实现
Nov 07 #Javascript
Checbox的操作含已选、未选及判断代码
Nov 07 #Javascript
You might like
在WordPress中安装使用视频播放器插件Hana Flv Player
2016/01/04 PHP
yii2缓存Caching基本用法示例
2016/07/18 PHP
PHP7匿名类的用法示例
2019/04/05 PHP
一个无限级XML绑定跨框架菜单(For IE)
2007/01/27 Javascript
javascript中的注释使用与注意事项小结
2011/09/20 Javascript
一个简单的弹性返回顶部JS代码实现介绍
2013/06/09 Javascript
JavaScript不使用prototype和new实现继承机制
2014/12/29 Javascript
jQuery制作可自定义大小的拼图游戏
2015/03/30 Javascript
jquery validate表单验证的基本用法入门
2016/01/18 Javascript
JavaScript中0和&quot;&quot;比较引发的问题
2016/05/26 Javascript
js精准的倒计时函数分享
2016/06/29 Javascript
微信小程序  modal详解及实例代码
2016/11/09 Javascript
vue数据控制视图源码解析
2018/03/28 Javascript
vue-router3.0版本中 router.push 不能刷新页面的问题
2018/05/10 Javascript
教你如何用node连接redis的示例代码
2018/07/12 Javascript
解决vue 单文件组件中样式加载问题
2019/04/24 Javascript
vue总线机制(bus)知识点详解
2020/05/10 Javascript
jQuery实现朋友圈查看图片
2020/09/11 jQuery
[48:37]EG vs OG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
学习Python需要哪些工具
2020/09/04 Python
python 决策树算法的实现
2020/10/09 Python
如何在网站上添加谷歌定位信息
2016/04/16 HTML / CSS
canvas实现按住鼠标移动绘制出轨迹的示例代码
2018/02/05 HTML / CSS
德国电子商城:ComputerUniverse
2017/04/21 全球购物
英国内衣连锁店:Boux Avenue
2018/01/24 全球购物
Paul’s Boutique官网:英国时尚手袋品牌
2018/03/31 全球购物
英国水族馆和池塘用品购物网站:Warehouse Aquatics
2019/08/29 全球购物
销售副总经理岗位职责
2013/12/11 职场文书
校园文化建设方案
2014/02/03 职场文书
激情洋溢的毕业生就业求职信
2014/03/15 职场文书
主持词开场白
2014/03/17 职场文书
2015年初中生自我评价范文
2015/03/03 职场文书
中学社团活动总结
2015/05/07 职场文书
辛亥革命观后感
2015/06/02 职场文书
励志语录:只有自己足够强大,才能不被别人践踏
2020/01/09 职场文书
Golang 切片(Slice)实现增删改查
2022/04/22 Golang