validation无效的10位移动号码和焦点输入字段

我需要用于在jQuery中validation电子邮件和移动电话号码的代码，并且还要focus()那些不满足validation的特定字段。

这是我的疑问

 
 Full Name *  Email *  Phone *    

Answer 1

对于电子邮件validation， 就够了..

对于移动没有使用模式属性输入如下：

您可以在http://html5pattern.com上查看更多模式。

为了专注于字段，您可以使用onkeyup（）事件：

 function check() { var pass1 = document.getElementById('mobile'); var message = document.getElementById('message'); var goodColor = "#0C6"; var badColor = "#FF9B37"; if(mobile.value.length!=10){ mobile.style.backgroundColor = badColor; message.style.color = badColor; message.innerHTML = "required 10 digits, match requested format!" }} 

你的HTML代码应该是：

Answer 2

上面的代码是正确的，但移动validation并不完美。

我修改为

 $('#enquiry_form').validate({ rules:{ name:"required", email:{ required:true, email:true }, mobile:{ required:true, minlength:9, maxlength:10, number: true }, messages:{ name:"Please enter your username..!", email:"Please enter your email..!", mobile:"Enter your mobile no" }, submitHandler: function(form) {alert("working"); //write your success code here } }); 

Answer 3

我使用$ form.submit（），因为它保持html输入validation。

我也使用输入类型tel，因为它支持移动浏览器，只显示数字小键盘。

  $('#mob_frm').submit(function(e) { e.preventDefault(); if(!$('#mobile').val().match('[0-9]{10}')) { alert("Please put 10 digit mobile number"); return; } }); 

Answer 4

你也可以使用jquery

  var phoneNumber = 8882070980; var filter = /^((\+[1-9]{1,4}[ \-]*)|(\([0-9]{2,3}\)[ \-]*)|([0-9]{2,4})[ \-]*)*?[0-9]{3,4}?[ \-]*[0-9]{3,4}?$/; if (filter.test(phoneNumber)) { if(phoneNumber.length==10){ var validate = true; } else { alert('Please put 10 digit mobile number'); var validate = false; } } else { alert('Not a valid number'); var validate = false; } if(validate){ //number is equal to 10 digit or number is not string enter code here... } 

Answer 5

测试完所有答案后没有成功。 有时输入也需要alpha字符。

这是最后一个完整的工作代码，只输入数字，如果数字不正确，还要记住用户的退格键按键事件。

 $("#phone").keydown(function(event) { k = event.which; if ((k >= 96 && k <= 105) || k == 8) { if ($(this).val().length == 10) { if (k == 8) { return true; } else { event.preventDefault(); return false; } } } else { event.preventDefault(); return false; } }); 

Answer 6

检查此validation库文件： http ： //bassistance.de/jquery-plugins/jquery-plugin-validation/演示： http ： //jquery.bassistance.de/validate/demo/

Answer 7

在脚本标记DEMO中使用jqueryvalidation器

并通过这样validation你的元素

  
 Full Name *  
 Email * 
 Phone * 
   

  $('#enquiry_form').validate({ rules:{ name:"required", email:{ required:true, email:true }, mobile:{ required:true, minlength:9, maxlength:10, } }, messages:{ name:"Please enter your username..!", email:"Please enter your email..!", mobile:"Enter your mobile no" }, submitHandler: function(form) { alert("working"); //write your success code here } }); 

Answer 8

 function is_mobile_valid(string_or_number){ var mobile=string_or_number; if(mobile.length!=10){ return false; } intRegex = /[0-9 -()+]+$/; is_mobile=true; for ( var i=0; i < 10; i++) { if(intRegex.test(mobile[i])) { continue; } else{ is_mobile=false; break; } } return is_mobile; } 

您可以通过调用函数is_mobile_valid(your_string_of_mobile_number);

Answer 9

 function isMobileNumber(evt, sender) { // Allows only 10 numbers // ONKEYPRESS FUNCTION //evt = (evt) ? evt : window.event; var charCode = (evt.which) ? evt.which : evt.keyCode; var NumValue = $(sender).val(); if (charCode > 31 && (charCode < 48 || charCode > 57)) {//|| NumValue.length > 9) { return false; } return true;} function isProperMobileNumber(txtMobId) { //// VALIDATOR FUNCTION var txtMobile = document.getElementById(txtMobId); if (!isNumeric(txtMobile.value)) { $(txtMobile).css("border-color", "red"); return false; } if (txtMobile.value.length < 10) { $(txtMobile).css("border-color", "red"); return false; } $(txtMobile).css("border-color", "") return true; } function isNumeric(n) { return !isNaN(parseFloat(n)) && isFinite(n) }