验证10位手机号码和焦点输入字段是否无效 [英] Validation for 10 digit mobile number and focus input field on invalid

问题描述

我需要代码来验证jQuery中的电子邮件和手机号码，并且还需要focus()在不满足验证的特定字段上进行验证.

I need the code for validating email and mobile number in jQuery and also focus() on that particular field where validations are not satisfied.

这是我的查询

<form name="enquiry_form" method="post" id="enquiry_form">

    Full Name *
    <input class="input-style" name="name"  id="name" type="text" required> 
    Email *
    <input class="input-style" name="email"  id="email" type="email" required>
    Phone * 
    <input name="mobile"  id="mobile" type="number" required>

    <input type="submit" value="SUBMIT"  id="enq_submit"">

</form>

推荐答案

对于电子邮件验证，<input type="email">就足够了..

for email validation, <input type="email"> is enough..

对于手机的不使用模式"属性，其输入如下:

for mobile no use pattern attribute for input as follows:

<input type="number" pattern="\d{3}[\-]\d{3}[\-]\d{4}" required>

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

you can check for more patterns on http://html5pattern.com.

要专注于字段，可以将onkeyup()事件用作:

for focusing on field, you can use onkeyup() event as:

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代码应为:

and your HTML code should be:

<input name="mobile"  id="mobile" type="number" required onkeyup="check(); return false;" ><span id="message"></span>

这篇关于验证10位手机号码和焦点输入字段是否无效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！