Question

我之前发现这个问题，并且看到建议添加一个名为alphanumeric的方法。我尝试添加此方法，但验证仍然不接受带破折号的电话号码。

有人看到我做错了吗？

$('#phone').keyup(function() {
		jQuery.validator.addMethod("alphanumeric", function(value, element) {
			return this.optional(element) || /^[a-z0-9\-]+$/i.test(value);
		}, "Numbers and dashes only");
	});
  $('#salesforce_submit').validate({
		rules: {
			phone: {
				required: true,
				//digits: true,
				minlength: 10,
				alphanumeric: true		
			}
		},
		messages: {
			phone: {
				required: "Please enter your phone number",
				digits: "Please enter a valid phone number with only numbers",
				minlength: "Your number seems a bit short, doesn't it?"
			}
		},
		submitHandler: function(form) {
			event.preventDefault();
			var datastring = $('#salesforce_submit').serialize();
			$.ajax({
				url: '/php/quoteSend.php',
				type: 'POST',
				data: datastring
				,
				success: function(data) {
					console.log(data);
					if (data == 'Error!') {
						alert('Unable to submit form!');
					} else {
					}
				},
				error: function(xhr, textStatus, errorThrown) {
					alert(textStatus + '|' + errorThrown);
					console.log('error');
				}
			});
   }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script>
<form id="salesforce_submit" method="POST" enctype="multipart/form-data">
		<div><input id="phone" placeholder="Phone*" class="input block" maxlength="12" name="phone" type="phone"></div>
    <input type="Submit" Value="Submit">
</form>

Answer 1

您可以使用此代码来允许数字和破折号

jQuery.validator.addMethod("numericdashe", function (value, element) {
console.log(value);
  if (/^[0-9\-]+$/i.test(value)) {
      return true;
  } else {
      return false;
  };
}, "Numbers and dashes only");

添加数字角色

phone: {
            required: true,
            //digits: true,
            minlength: 10,
            //alphanumeric: true
            numericdashe: true      
        }
    },

无需在jQuery.validator.addMethod侦听器中添加keyup。

Answer 2

你的正则表达式有问题。

documentation有效：/^ [+] [（] {0,1} [0-9] {1,3} [）] {0,1} [ - } ./ 0-9] $ / I

This regex

$('#phone').keyup(function() {
		jQuery.validator.addMethod("alphanumeric", function(value, element) {
			return this.optional(element) || /^[+]*[(]{0,1}[0-9]{1,3}[)]{0,1}[-\s\./0-9]*$/i.test(value);
		}, "Numbers and dashes only");
	});
  $('#salesforce_submit').validate({
		rules: {
			phone: {
				required: true,
				//digits: true,
				minlength: 10,
				alphanumeric: true		
			}
		},
		messages: {
			phone: {
				required: "Please enter your phone number",
				digits: "Please enter a valid phone number with only numbers",
				minlength: "Your number seems a bit short, doesn't it?"
			}
		},
		submitHandler: function(form) {
			event.preventDefault();
			var datastring = $('#salesforce_submit').serialize();
      
			$.ajax({
				url: '/php/quoteSend.php',
				type: 'POST',
				data: datastring
				,
				success: function(data) {
					console.log(data);
					if (data == 'Error!') {
						alert('Unable to submit form!');
					} else {
					}
				},
				error: function(xhr, textStatus, errorThrown) {
					alert(textStatus + '|' + errorThrown);
					console.log('error');
				}
			});
   }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script>
<form id="salesforce_submit" method="POST" enctype="multipart/form-data">
		<div><input id="phone" placeholder="Phone*" class="input block" maxlength="12" name="phone" type="phone"></div>
    <input type="Submit" Value="Submit">
</form>

如何让jQuery验证以允许数字包含破折号

2 个答案: