守望麦香花开
- 浏览: 49762 次
-
文章分类
最新评论
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>自动校验功能</title>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/validate.js"></script>
<style type="text/css">
.suc{
background-color: red;
}
</style>
<script type="text/javascript">
$(function() {
//自定义校验方法addMethod中的参数1:验证的方法名，参数2：验证规则，参数3：验证提示信息
$.validator.addMethod("formula",function(value,element,param){
return this.value == eval(param);
},'请正确输入数学计算正确后的结果');
$("#form1").validate({
rules:{
username:{
required:true,
minlength:2
},
email:{
required:true,
email:true
},
url:{
required:true,
url:true
},
valcode:{
formula: "7+9"
}
},
/* messages{
username:{
required:'请输入姓名',
minlength:'请至少输入两个字符'
},
email:{
required:'请输入电子邮箱',
email:'请检查电子邮箱格式'
}
}, */
/*
errorElement:"em",//用来创建错误提示信息
success:function(label){//验证成功后执行的回调函数，label指向上面那个错误提示信息标签em
label.text(" ").addClss("suc");//清空错误提示信息,并添加上样式
} */
});
});
</script>
</head>
<body>
<form action="#" method="post" id="form1">
用户名:<input type="text" name="username" value=""><br><br>
年 龄:<input type="text" name="age" value=""><br><br>
邮 箱:<input type="text" name="email" value=""><br><br>
地 址:<input type="text" name="url" value=""><br><br>
<label for="cvalcode">验证码:</label>
<input id="cvalcode" type="text" name="valcode" size="25" value="">=7+9
<input type="button" value="提交">
</form>
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title>自动校验功能</title>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/validate.js"></script>
<style type="text/css">
.suc{
background-color: red;
}
</style>
<script type="text/javascript">
$(function() {
//自定义校验方法addMethod中的参数1:验证的方法名，参数2：验证规则，参数3：验证提示信息
$.validator.addMethod("formula",function(value,element,param){
return this.value == eval(param);
},'请正确输入数学计算正确后的结果');
$("#form1").validate({
rules:{
username:{
required:true,
minlength:2
},
email:{
required:true,
email:true
},
url:{
required:true,
url:true
},
valcode:{
formula: "7+9"
}
},
/* messages{
username:{
required:'请输入姓名',
minlength:'请至少输入两个字符'
},
email:{
required:'请输入电子邮箱',
email:'请检查电子邮箱格式'
}
}, */
/*
errorElement:"em",//用来创建错误提示信息
success:function(label){//验证成功后执行的回调函数，label指向上面那个错误提示信息标签em
label.text(" ").addClss("suc");//清空错误提示信息,并添加上样式
} */
});
});
</script>
</head>
<body>
<form action="#" method="post" id="form1">
用户名:<input type="text" name="username" value=""><br><br>
年 龄:<input type="text" name="age" value=""><br><br>
邮 箱:<input type="text" name="email" value=""><br><br>
地 址:<input type="text" name="url" value=""><br><br>
<label for="cvalcode">验证码:</label>
<input id="cvalcode" type="text" name="valcode" size="25" value="">=7+9
<input type="button" value="提交">
</form>
</body>
</html>
分享到：
发表评论
-
jquery选择器总结
2016-09-22 10:59 499jQuery 的选择器可谓之强 ... -
网页选项卡的切换
2016-09-22 10:53 453<!DOCTYPE html> <html& ... -
JQuery的extend扩展
2016-09-18 15:23 439JQuery的extend扩展方法： Jquery ... -
jquery实现全选，全不选，反选效果
2016-09-13 15:41 441<!DOCTYPE html PUBLIC " ... -
jquery实现全选，全不选，反选效果
2016-09-13 15:40 0<!DOCTYPE HTML> <html& ... -
封装数据_方法
2016-08-26 17:30 508var simple_confNetwork={ in ... -
jquery对对象数组的遍历的两种方式
2016-08-26 15:00 1926jquery对对象数组的遍历的两种方式 data: [ { ... -
query，bootstrap在开发中使用的总结
2016-08-24 09:50 610当ajax请求返回的数据date如上面所显示，要达到下图所示的 ... -
select初始化操作
2016-08-23 15:54 797select 初始化值，option 的value是id,内容 ... -
select初始化操作
2016-08-23 15:50 0select 初始化值，option 的value是id,内容 ... -
bootstrap日期插件daterangepicker的使用
2016-08-22 10:59 928今天用的了bootstrap日期插件感觉搜索的资料不是很多在此 ... -
Jquery选择器
2016-08-19 10:08 657JQuery: 一：入门 二：选择器 三：DOM操作 四：事件 ... -
Vue.js 60 分钟快速入门
2016-08-19 09:20 556Vue.js介绍 Vue.js是当下很火的一个JavaScr ... -
Java构造和解析Json数据的两种方法详解一
2016-08-18 13:01 434在www.json.org上公布了很多JAVA下的json ... -
HTML5时钟
2016-08-18 12:31 521本示例使用HTML5的canvas标签和Javascript脚 ... -
同步更新input中的内容
2016-08-16 14:15 546HTML： <div class="form ... -
JQuery验证
2016-08-16 09:46 526js-----> var table = in ... -
jQuery.Validate验证库的使用
2016-08-15 16:24 510一、用前必备 转载：http://www.cnblogs.c ...
相关推荐
`jQuery Validate` 是一个流行的JavaScript库，用于在前端进行表单验证。这个库极大地简化了网页表单数据的验证过程，使得开发者可以方便地定义验证规则，并为用户提供实时的反馈。下面将详细介绍`jQuery Validate`...
当用户提交表单时，jQuery Validate会自动进行验证，并显示相应的错误信息。 总的来说，这个压缩包提供了实现中文表单验证所需的全部资源，包括jQuery库、jQuery Validate插件以及中文错误消息文件，使得开发者能够...
在IT行业中，自动校验源码是一项至关重要的任务，它能确保代码的质量，减少错误，提高软件的稳定性。本文将围绕“自动校验工程源码”这一主题，深入探讨基于反射的自动校验工具类及其相关知识点。 首先，我们要理解...
validate-api工具类主要被用于Java应用中的数据校验，它基于JSR 303（Bean Validation）和JSR 349（Bean Validation 1.1）标准，提供了对对象属性的有效性验证功能。这个工具类的正常运行依赖于一系列的jar包，这些...
4. **触发验证**：当表单提交或特定事件触发时，验证插件会自动运行验证逻辑。如果输入不符合规则，会显示相应的错误消息。 5. **处理验证结果**：根据验证结果，你可以决定是否允许表单提交。如果所有字段都通过...
**响应式布局**是一种设计方法，使得网站可以根据访问设备的屏幕尺寸和方向自动调整布局。主要基于以下技术： 1. **媒体查询（Media Queries）**：CSS3引入的一种机制，允许内容根据设备特性（如宽度、高度、分辨率...
你需要创建一个XML验证文件（如`LoginAction-validation.xml`），在这个文件中定义具体的校验规则，然后Struts2会自动读取并应用这些规则。例如： ```xml <!-- LoginAction-validation.xml --> 用户名不能...
4. **自定义错误元素样式**：jQuery Validate会自动为错误的输入元素添加一个`error`类。你可以通过CSS来定义这个类的样式，以改变错误状态下的元素外观。 5. **自定义错误标签**：默认情况下，错误消息会在输入...
jQuery Validate 是一个强大的表单验证插件，它允许开发者通过简单的配置在客户端对表单进行校验，确保用户输入的数据满足预设的规则。使用该插件可以提升用户体验，防止无效数据提交到服务器。 #### 知识点二：...
jQuery的表单校验插件`validate`是前端开发中常用的一个工具，它极大地简化了JavaScript对HTML表单数据的验证过程。这个插件通过与jQuery库紧密结合，提供了丰富的自定义规则和错误提示功能，使得开发者可以快速地...
3. **返回结果**：如果`validate`方法中添加了错误信息，Struts2会自动将结果设置为"input"，表示验证失败，需要用户重新输入。此时，不会执行`execute`方法，而是跳转回表单页面并显示错误信息。错误信息可以通过`...
### jQuery.validate 表单验证框架详解 在现代Web开发中，表单验证是不可或缺的一环，它确保用户输入的数据符合预期格式，从而提高用户体验并减少服务器端的压力。jQuery.validate插件便是为此而生，它提供了丰富的...
而`EasyValidate`利用注解，可以在编译时自动生成校验逻辑，使代码更加整洁、易于维护。 要使用`EasyValidate`，首先要在项目的`build.gradle`文件中添加依赖。在`allprojects`块中添加仓库URL，然后在模块的`build...
如果业务逻辑方法没有指定的验证方法，Struts2会尝试使用`validate()`方法进行校验。 当需要避免`validate()`方法执行时，有两种策略： - 不重写`validate()`方法，但这会导致`execute()`方法无法被校验。 - 添加一...
这个插件扩展了protobuf的功能，使得在服务端和客户端可以对输入数据进行严格的校验，从而提高系统的稳定性和安全性。 在Go语言环境中，protoc-gen-validate提供了方便的方式来处理数据验证。在protobuf消息类型中...
3. **反射调用校验方法**：接着，框架会通过反射机制调用Action中的`validateXxx()`方法或通用的`validate()`方法，执行更深入的校验逻辑。 4. **结果处理**：如果没有异常发生，控制权将传递给用户请求的处理方法...
Struts2提供了一种内建的数据校验机制，即在Action类中定义validate()方法。这个方法会在调用`execute()`之前自动执行，用于验证用户提交的表单数据。我们可以在`validate()`方法中添加如下代码： ```java ...
总结，Struts2的输入校验机制提供了手动和自动两种方式，结合配置文件和内置校验器，能够实现灵活且强大的数据校验，有效地防止了非法数据的流入，提升了系统的安全性。在实际开发中，开发者可以根据业务需求选择...
当校验失败时，通过添加错误消息到相应的集合，Struts 2框架会自动将这些错误信息传递回视图层显示给用户。 Struts 2的数据校验还可以通过注解方式进行，使用@FieldCheck、@Validations等注解来指定字段的校验规则...
struts2的输入校验有两种方式: 一.重写validate()方式 二.采用配置文件的方式 先我们就以一个简单的登录的例子来讲解这个... 就OK了，不要作别的改动，struts2在启动时，会自动导入LoginAction-validation.xml的!