JE上搜索js校验插件一搜一大把,大部分做的都不错,不过总是感觉用着达到自己想要的结果,于是乎,就自己搞了个,但是严格来说这并不算一个jquery插件(没有按照jquery插件定义的格式来写,因为原本是打算用元素js代码写的,后来考虑代码的维护性和简洁性采用了jquery)
由于本人技术有限,这个只是个demo,欢迎各位进一步完善(代码中注释很完善)
废话不多说,以下是这个插件的说明:
插件大小:6K(js)+1k(css)=7kb
1.无需书写js,只需要导入jquery.js和本js即可
2.常规校验采用 <input jType="" jSize='min,[max]' jErr=''/>的形式,
其中jType为定义好的校验类型,
有可选参数 english,china,email,id,number,type1
jSize为配置输入的最大和最少参数,若jSize不写则默认输入长度了1~max
jErr为自定义错误输出,不配置该属性则会启用默认输出
3.自定义正则校验
<input type="text" jUser="正则表达式" JErr="自定义错误输出" />
4.ajax校验
<input type="text" jAjax="URL" name='name' jErr="自定义错误输出" />
后台返回字符串'true'或'false',true表示校验成功,false表示校验失败,其中URL不要带以本元素name命名的参数
<input type="text" jAjax="testAction.do" name='username' jErr="异步校验失败" />
后台核心代码
String name =request.getParameter("username");
if(name.equals("admin")){
response.getWriter().write("true");
}else{
response.getWriter().write("false");
}
System.out.println("name="+name);
5.通过submit按钮提交的时候,若有校验没通过,则表单无法提交
6.如果通过按钮提交表单,续加入属性 jForm="true"
然后再js中进行引入 var check =checkFormJs();
if(check==false){
//表单校验未通过
}else{
//校验通过,自己书写提交表单代码
}
7.更多例子请参加附件
分享到:
相关推荐
在IT行业中,jQuery是一个广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理以及Ajax交互。本主题聚焦于jQuery中的Ajax校验,这是一种在客户端进行数据验证的技术,它能够提高用户体验,减少不必要的服务器...
在Spring MVC框架中,Ajax(Asynchronous JavaScript and XML)验证是一种常见的前端与后端交互方式,用于实现实时、无刷新的数据验证。这种方式可以提高用户体验,因为在用户提交表单前就能得知输入数据是否符合...
- **AJAX异步验证**:在用户输入时,通过发送Ajax请求到服务器,验证用户输入的有效性,如检查用户名是否已存在。 总的来说,js的校验码使用在Web开发中扮演着至关重要的角色,它可以增强安全性,提供更好的用户...
在"jQuery 插件 校验"这个主题中,我们主要关注的是如何使用jQuery来开发和应用验证插件,以确保用户输入的数据符合预设的规则和格式。 在Web开发中,数据校验是一个至关重要的环节,特别是在表单提交时,以防止...
该插件支持自定义验证规则,因此可以灵活地满足各种验证需求。使用jQuery Validate时,往往需要与AJAX技术结合使用,以便在客户端校验的基础上,将数据发送到服务器端进行进一步的校验。 在本实例中,jQuery ...
AJAX异步提交** 当用户点击提交按钮时,我们使用jQuery库中的`$.ajax()`方法发送POST请求到服务器。这个方法包含了请求类型、URL、数据和预期的响应类型。 ```javascript $(function() { $(":button").on("click...
"jq 表单校验工具"是一个专门用于JavaScript(js)和jQuery(jq)环境的插件,它提供了强大的功能来帮助开发者实现对表单输入的实时验证。 首先,我们来看一下这个工具的核心功能。"传参"意味着你可以向校验方法...
在实际项目中,我们还需要考虑如何处理验证失败的情况,通常会通过显示错误信息提示用户,或者使用AJAX异步提交数据时在服务端再次进行验证,以增加安全性。 总之,JS校验脚本是前端开发中不可或缺的一部分,它涉及...
综上所述,“jQuery超强验证表单”涉及的知识点涵盖了jQuery基础、表单验证原理、验证插件使用、自定义规则和错误消息、实时验证、AJAX提交以及错误处理等方面。掌握这些内容,可以提升你在Web开发中处理表单验证的...
本人自己开发的jquery表单验证控件! 使用方便,样式美观,完全开源。...btnsubmit:可选 指定一个绑定提交事件的控件ID,如一个普通按钮或一个超链接,表单中的submit依然有效 其它具体使用方法,请参阅demo文件!
**jQuery基础实例01——用户名校验** 在Web开发中,客户端验证是必不可少的一部分,它能够提高用户体验,减少无效请求...在后续的实例中,我们可以探索更多关于jQuery的功能,如Ajax异步通信、动画效果和插件使用等。
这里我们使用`ajaxForm`方法来创建一个异步表单提交,并设定`beforeSubmit`回调函数,该函数会在表单提交前被调用,用于数据校验。例如: ```javascript $(document).ready(function() { $('#myForm').ajaxForm({ ...
虽然这个资源包可能专注于纯JS验证,但实际开发中,开发者可能会使用jQuery的`.validate()`插件或Vue.js的内置指令(v-model和v-validate)来简化表单验证流程。 七、实践与学习 对于初学者来说,这个资源包提供了...
jQuery插件ajaxupload是用于实现文件上传功能的一个工具,它可以在客户端通过JavaScript异步地上传文件到服务器。在本文中,将详细介绍如何利用ajaxupload插件实现文件上传操作,并提供相应的代码示例和截图说明,...
除此之外,JavaScript还可以用于实现更复杂的交互,比如AJAX异步请求,它可以在不刷新整个页面的情况下更新部分网页内容,提升用户交互体验。此外,随着前端技术的发展,JavaScript框架如React、Vue和Angular也提供...
jQuery.validationEngine是一款强大的JavaScript插件,专用于前端表单验证。这款插件以其简洁的API、丰富的验证规则和良好的国际化支持而备受青睐。在中文环境中,它可以为用户提供友好的中文提示,确保用户输入的...
综上所述,“邮箱jQuery验证”涉及的主要知识点包括jQuery事件处理、正则表达式验证、AJAX异步请求、JSON数据解析以及前端UI交互的优化。通过合理运用这些技术,我们可以构建出高效、友好的邮箱输入验证和自动填充...
总结起来,jQuery插件form-validation-engine是一个功能强大的表单验证解决方案,它通过正则表达式和异步验证提供灵活的数据校验。通过深入理解和熟练运用,你可以创建出具有严格数据验证机制的高效表单,从而提高...
这时可以使用Ajax异步请求: ```javascript function asyncValidateUsername(username, callback) { $.ajax({ url: "/api/check_username", data: { username: username }, success: function(response) { ...
8. **Ajax通信**:在用户点击获取验证码或提交表单时,可以通过Ajax异步请求将数据发送到服务器,这样不会刷新整个页面,保持用户交互的流畅性。 9. **CSS样式**:提供的`css`目录下的文件用于设置页面样式,包括...