javascript - 如何使用 jquery.validate.min.js 验证电话号码和电子邮件?

标签 javascript jquery

我已设法调整一个 jquery 表单验证示例以适用于我的网站,但我不知道如何确保它只是在电话号码字段中输入的数字以及在电子邮件字段中输入的电子邮件地址。

请问有人能帮忙吗?

还想知道是否有任何可以改进的地方?

<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script>
$(function() {
   $( "#quickform" ).validate({
           rules: {
                   name: {
                       required: true
                   },
                   phone: {
                       required: true,
                       phonevalidation: true
                   },
                   email: {
                       required: true,
                       emailvalidation: true
                   },
                   enquiry: {
                       required: true
                   }

           },
           messages: {
                   name: {
                       required: "Please enter your name."                         
                   },
                   phone: {
                       required: "Please enter your phone number."                         
                   },
                   email: {
                       required: "Please enter your email address."                         
                   },
                   enquiry: {
                       required: "Please enter your enquiry."                         
                   }
           },
   });
   $.validator.addMethod("phonevalidation",
           function(value, element) {
                   return /^[A-Za-z\d=#$%@_ -]+$/.test(value);
           },
   "Please enter a valid phone number."
   );
   $.validator.addMethod("emailvalidation",
           function(value, element) {
                   return /^[A-Za-z\d=#$%@_ -]+$/.test(value);
           },
   "Please enter a valid email address."
   );
});
</script>

编辑:

示例中已经有验证方法,但不接受特殊字符。我只需要了解如何将/^[A-Za-z\d=#$%@_ -]+$/更改为电子邮件和号码验证。

最佳答案

验证框架中已经存在emailphone 规则

<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js"></script>
<script>
$(function() {
    $( "#quickform" ).validate({
        rules: {
            name: {
                required: true
            },
            phone: {
                required: true,
                phoneUK: true //or look at the additional-methods.js to see available phone validations
            },
            email: {
                required: true,
                email: true
            },
            enquiry: {
                required: true
            }

        },
        messages: {
            name: {
                required: "Please enter your name."                         
            },
            phone: {
                required: "Please enter your phone number."                         
            },
            email: {
                required: "Please enter your email address."                         
            },
            enquiry: {
                required: "Please enter your enquiry."                         
            }
        },
    });

});
</script>

关于javascript - 如何使用 jquery.validate.min.js 验证电话号码和电子邮件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16298931/

相关文章:

javascript - Jquery inArray 在循环中总是返​​回 -1

javascript - 更改文本区域中唯一单词的样式/颜色?不是除法

javascript - 确定函数是否是 jQuery promise

javascript - javascript 错误 500 内部服务器错误

javascript - JQuery/JavaScript 键盘事件

javascript - jQuery 或 javascript 阻止输入按键事件

jquery - jquery最好的弹出框插件

javascript - 猫头鹰旋转木马销毁问题(未捕获的类型错误 : Cannot read property 'destroy' of undefined )

javascript - 使用 for/in 循环的 javascript 过滤器?

javascript - 如何在没有任何提交按钮的情况下动态显示基于从下拉列表中选择的年份的记录