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 编程引入命名空间的方法与代码
Aug 13 Javascript
js 事件小结 表格区别
Aug 13 Javascript
jQuery 第二课 操作包装集元素代码
Mar 14 Javascript
关于jquery input textare 事件绑定及用法学习
Apr 03 Javascript
深入理解Javascript动态方法调用与参数修改的问题
Dec 10 Javascript
jQuery实现自定义checkbox和radio样式
Jul 13 Javascript
AngularJS基础 ng-model-options 指令简单示例
Aug 02 Javascript
AngularJS 单元测试(一)详解
Sep 21 Javascript
jquery操作ID带有变量的节点实例
Dec 07 Javascript
vue 修改 data 数据问题并实时显示的方法
Aug 27 Javascript
vue.js指令v-for使用以及下标索引的获取
Jan 31 Javascript
VUE之图片Base64编码使用ElementUI组件上传
Apr 09 Vue.js
原生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利用COM对象访问SQLServer、Access
2006/10/09 PHP
坏狼的PHP学习教程之第1天
2008/06/15 PHP
php根据日期判断星座的函数分享
2014/02/13 PHP
百度地图API应用之获取用户的具体位置
2014/06/10 PHP
PHPCMS2008广告模板SQL注入漏洞修复
2016/10/11 PHP
[原创]PHPCMS遭遇会员投稿审核无效的解决方法
2017/01/11 PHP
iis 7下安装laravel 5.4环境的方法教程
2017/06/14 PHP
Javascript - HTML的request类
2006/07/15 Javascript
JavaScript效率调优经验
2009/06/04 Javascript
基于jQuery的简单九宫格实现代码
2012/08/09 Javascript
js实现select跳转功能代码
2014/10/22 Javascript
Jquery 分页插件之Jquery Pagination
2015/08/25 Javascript
js实现的早期滑动门菜单效果代码
2015/08/27 Javascript
JavaScript进阶练习及简单实例分析
2016/06/03 Javascript
jQuery EasyUI Tab 选项卡问题小结
2016/08/16 Javascript
jQuery实现花式轮播之圣诞节礼物传送效果
2016/12/25 Javascript
javascript修改浏览器title方法 JS动态修改浏览器标题
2017/11/30 Javascript
快速解决vue动态绑定多个class的官方实例语法无效的问题
2018/09/05 Javascript
vue富文本编辑器组件vue-quill-edit使用教程
2018/09/21 Javascript
vue点击标签切换选中及互相排斥操作
2020/07/17 Javascript
[56:21]LGD vs IG 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
在Python中使用zlib模块进行数据压缩的教程
2015/06/26 Python
Python 爬虫学习笔记之正则表达式
2016/09/21 Python
Python 含参构造函数实例详解
2017/05/25 Python
python实现websocket的客户端压力测试
2019/06/25 Python
Python正则表达式匹配日期与时间的方法
2019/07/07 Python
Python Selenium异常处理的实例分析
2021/02/28 Python
如何打印出当前源文件的文件名以及源文件的当前行号
2015/04/05 面试题
个人找工作自荐信格式
2013/09/21 职场文书
2015年保险公司工作总结
2015/04/24 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
使用python如何删除同一文件夹下相似的图片
2021/05/07 Python
php+laravel 扫码二维码签到功能
2021/05/15 PHP
企业版Windows 11有哪些新功能? Win11适用于企业的功能介绍
2021/11/21 数码科技
Python语言中的数据类型-序列
2022/02/24 Python
Android Flutter实现图片滑动切换效果
2022/04/07 Java/Android