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 相关文章推荐
JavaScript 对Cookie 操作的封装小结
Dec 31 Javascript
基于Jquery的动态添加控件并取值的实现代码
Sep 24 Javascript
javascript学习笔记(十四) window对象使用介绍
Jun 20 Javascript
JS验证邮箱格式是否正确的代码
Dec 05 Javascript
js中opener与parent的区别详细解析
Jan 14 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 Javascript
AngularJS入门教程之Cookies读写操作示例
Nov 02 Javascript
js,jq,css多方面实现简易下拉菜单功能
May 13 Javascript
jquery单击文字或图片内容放大并居中显示
Jun 23 jQuery
详解js删除数组中的指定元素
Oct 31 Javascript
基于webpack4.X从零搭建React脚手架的方法步骤
Dec 23 Javascript
jQuery实现tab栏切换效果
Dec 22 jQuery
原生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
用PHP生成静态HTML速度快类库
2007/03/18 PHP
简单实用的PHP防注入类实例
2014/12/05 PHP
jquery统计复选框选中示例
2013/11/05 Javascript
JavaScript Math.ceil() 函数使用介绍
2013/12/11 Javascript
JavaScript加入收藏夹功能(兼容IE、firefox、chrome)
2014/05/05 Javascript
PHP配置文件php.ini中打开错误报告的设置方法
2015/01/09 PHP
JQuery报错Uncaught TypeError: Illegal invocation的处理方法
2015/03/13 Javascript
原生js实现类似弹窗抖动效果
2015/04/02 Javascript
输入法的回车与消息发送快捷键回车的冲突解决方法
2016/08/09 Javascript
Bootstrap DateTime Picker日历控件简单应用
2017/03/25 Javascript
移动端使用localResizeIMG4压缩图片
2017/04/22 Javascript
Vue.js中兄弟组件之间互相传值实例
2017/06/01 Javascript
JavaScript对象拷贝与Object.assign用法实例分析
2018/06/20 Javascript
详解VUE中常用的几种import(模块、文件)引入方式
2018/07/03 Javascript
JavaScript享元模式原理与用法实例详解
2020/03/09 Javascript
JavaScript 函数用法详解【函数定义、参数、绑定、作用域、闭包等】
2020/05/12 Javascript
如何在JavaScript中等分数组的实现
2020/12/13 Javascript
[02:42]岂曰无衣,与子同袍!DOTA2致敬每一位守护人
2020/02/17 DOTA
Python+OpenCV实现车牌字符分割和识别
2018/03/31 Python
python3中zip()函数使用详解
2018/06/29 Python
Python实现的批量修改文件后缀名操作示例
2018/12/07 Python
python 动态迁移solr数据过程解析
2019/09/04 Python
通过Turtle库在Python中绘制一个鼠年福鼠
2020/02/03 Python
python自动下载图片的方法示例
2020/03/25 Python
Python爬虫之Selenium实现键盘事件
2020/12/04 Python
HTML5添加禁止缩放功能
2017/11/03 HTML / CSS
Nike瑞典官方网站:Nike.com (SE)
2018/11/26 全球购物
const和static readonly区别
2013/05/20 面试题
出纳工作岗位责任制
2014/02/02 职场文书
毕业生应聘求职信
2014/07/10 职场文书
学校四风对照检查材料
2014/08/28 职场文书
班子群众路线教育实践个人对照检查材料思想汇报
2014/09/30 职场文书
领导干部群众路线剖析材料
2014/10/09 职场文书
交通局领导班子群众路线教育实践活动对照检查材料思想汇报
2014/10/09 职场文书
2016年校园社会综合治理宣传月活动总结
2016/03/16 职场文书
导游词之白茶谷九龙峡
2019/10/23 职场文书