菜单切换
FACESOHO知行者
心灵
记录
远方
赞赏工具
源代码:
点击运行
保存
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>jQuery Validate 插件 - 自定义消息作为元素数据</title> <link rel="stylesheet" media="screen" href="/public/jquery/jquery-validation-1.14.0/demo/css/screen.css"> <!--[if gte IE 9]><!--><script src="//cdn.staticfile.org/jquery/2.0.3/jquery.min.js"></script><!--<![endif]--><!--[if lt IE 9]><script src="//cdn.staticfile.org/jquery/1.9.1/jquery.min.js"></script><script src="//cdn.staticfile.org/html5shiv/r29/html5.min.js"></script><script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script><![endif]--> <script src="/public/jquery/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script> <script src="/public/jquery/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#commentForm").validate(); $("#commentForm2").validate({ messages:{ email:{ required:'请输入!' } } }); }); </script> <style type="text/css"> form { width:500px; } form label { width:250px; } form label.error, form input.submit { margin-left:253px; } </style> </head> <body> <div id="main"> <p>本实例演示了如何通过元数据自定义消息。</p> <!-- 通过 data- 属性自定义规则和消息 --> <form class="cmxform" id="commentForm" method="post" action="/try/try.php"> <fieldset> <legend>请输入您的电子邮件地址</legend> <p> <label for="cemail">E-Mail *</label> <input id="cemail" name="email" data-rule-required="true" data-rule-email="true" data-msg-required="请输入您的电子邮件地址" data-msg-email="请输入一个有效的电子邮件地址" /> </p> <p> <input class="submit" type="submit" value="提交"/> </p> </fieldset> </form> <!-- 自定义通过 validate 选项重载的元数据中 "required" 的消息 --> <form class="cmxform" id="commentForm2" method="post" action="/try/try.php"> <fieldset> <legend>请输入您的电子邮件地址</legend> <p> <label for="cemail">E-Mail *</label> <input id="cemail" name="email" data-rule-required="true" data-rule-email="true" data-msg-email="请输入一个有效的电子邮件地址" /> </p> <p> <input class="submit" type="submit" value="提交"/> </p> </fieldset> </form> </body> </html>
运行结果