当前位置: 首页 > 编程笔记 >

jQuery Validate设置onkeyup验证的实例代码

俞学
2023-03-14
本文向大家介绍jQuery Validate设置onkeyup验证的实例代码,包括了jQuery Validate设置onkeyup验证的实例代码的使用技巧和注意事项,需要的朋友参考一下

jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求。下面给大家分享一段jquery validate 设置onkeyup验证的代码,具体代码如下所示:

代码如下所示:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/lib/jquery.js"></script> 
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script> 
<script src="https://static.runoob.com/assets/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script> 
<script> 
$.validator.setDefaults({ 
submitHandler: function() { 
alert("提交事件!"); 
} 
}); 
$().ready(function() { 
$("#commentForm").validate({ 
onkeyup: function(element) { $(element).valid(); } 
}); 
}); 
</script> 
<style> 
.error{ 
color:red; 
} 
</style> 
</head> 
<body> 
<form class="cmxform" id="commentForm" method="get" action=""> 
<fieldset> 
<legend>输入您的名字,邮箱,URL,备注。</legend> 
<p> 
<label for="cname">Name (必需, 最小两个字母)</label> 
<input id="cname" name="name" minlength="2" type="text" required> 
</p> 
<p> 
<label for="cemail">E-Mail (必需)</label> 
<input id="cemail" type="email" name="email" required> 
</p> 
<p> 
<label for="curl">URL (可选)</label> 
<input id="curl" type="url" name="url"> 
</p> 
<p> 
<label for="ccomment">备注 (必需)</label> 
<textarea id="ccomment" name="comment" required></textarea> 
</p> 
<p> 
<input class="submit" type="submit" value="Submit"> 
</p> 
</fieldset> 
</form> 
</body> 
</html>

相关阅读:

利用jQuery.Validate异步验证用户名是否存在(推荐)

JQuery validate插件Remote用法大全

jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法

jquery.validate 自定义验证方法及validate相关参数

以上所述是小编给大家介绍的jQuery Validate设置onkeyup验证,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持!

 类似资料:
  • 本文向大家介绍Ajax+Struts2实现验证码验证功能实例代码,包括了Ajax+Struts2实现验证码验证功能实例代码的使用技巧和注意事项,需要的朋友参考一下 众所周知,验证码在我们的生活中都是非常常见的,很多公司都在各种折腾各种各样的验证码,这里简要的用一个小案例来实现验证码的功能(ps:其实我挺讨厌验证码这个东西的)。 今天分享的是通过ajax来动态的验证验证码输入是否正确。我们这里采用的

  • 本文向大家介绍python django 实现验证码的功能实例代码,包括了python django 实现验证码的功能实例代码的使用技巧和注意事项,需要的朋友参考一下 我也是刚学Python  Django不久很多都不懂,所以我现在想一边学习一边记录下来然后大家一起讨论! 验证码功能一开始我在网上找了很多的demo但是我在模仿他们写的时候,发现在我的版本上根本就不能运行起来在前端页面显示的时候是图

  • 本文向大家介绍jQuery完成表单验证的实例代码(纯代码),包括了jQuery完成表单验证的实例代码(纯代码)的使用技巧和注意事项,需要的朋友参考一下 废话不多说了,直接给大家贴代码了,具体代码如下所示: 总结 以上所述是小编给大家介绍的jQuery完成表单验证的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对呐喊教程网站的支持!

  • 本文向大家介绍JavaScript 随机验证码的生成实例代码,包括了JavaScript 随机验证码的生成实例代码的使用技巧和注意事项,需要的朋友参考一下 随机验证码的生成 1: 主体部分 接下来时如何放入到验证框里面了 <input type="text"  id="checkCode" class="unchanged" style="width: 80px"  readonly/>    接

  • 本文向大家介绍AngularJS 输入验证详解及实例代码,包括了AngularJS 输入验证详解及实例代码的使用技巧和注意事项,需要的朋友参考一下 AngularJS 输入验证 AngularJS 表单和控件可以验证输入的数据。 输入验证 在前面的几个章节中,你已经学到关于 AngularJS 表单和控件的知识。 AngularJS 表单和控件可以提供验证功能,并对用户输入的非法数据进行警告。 注

  • 本文向大家介绍Java生成验证码功能实例代码,包括了Java生成验证码功能实例代码的使用技巧和注意事项,需要的朋友参考一下 页面上输入验证码是比较常见的一个功能,实现起来也很简单.给大家写一个简单的生成验证码的示例程序,需要的朋友可以借鉴一下. 闲话少续,直接上代码.代码中的注释很详细. 上面这段代码就能生成一个验证码,略微修改就能生成各种各样的形式,main方法可以测试. 下面为大家写一下如何返