我的应用程序 jQuery 不工作

Question

我有一个注册表：

<div id ="regis" class="col-md-6 col-md-offset-1">
   <form >
    <p>
    Fisrt Name:
     <input id="fname1" class="input" type ="text"/>
    </p>
    <p>
      Last Name:
        <input id="lname1" class="input" type ="text"/>
    </p>
    <p>
        NIC Number:
        <input id="nic" class="input" type ="text"/>
    </p>
    <p>
        Email Address:
        <input id="eml" class="input" type ="text"/>
    </p>
       <p>

%0s...'...-q' “# ?�UmlIqc7,`�oe”er:

保存

这是我的 jQuery 独立 re.js 文件代码。我需要验证上述表格。不幸的是，这没有验证。

$(document).ready(function (event){
$("#sub").click(function(){  //submit btn
   var  ffname = $("#fname1"); //fisrst name
   var  lname = $("#lname1");
   var  nic = $("#nic");
   var  eml1 = $("#eml");
   var  tp = $("#tp");


    if(ffname.val() ==""){
        $("this").css("background-color" , "red");
    }
    else
    {
        $("this").css("background-color" , "green");
    }

    if(nic.length <10 || nic.length>10 || nic.length <=0)
    {
        alert("please enter correct NIC Number");
    }
    else if(nic.length ==10)
    {

        var a = nic.substr(0,2);
        alert("your birth year is:"+a);
      }
   });
});

Answer 1

您可以通过新的 HTML5 属性（必需和模式）和 CSS3 来实现您想要实现的目标，请参见下面的小提琴：

<li>
     <label for="nic">NIC Number:</label>
     <input id="nic" type="text" pattern = "^\d{10}$" required />
</li>

JS Fiddle Example

新的 HTML5 属性允许您添加将应用于相应输入的正则表达式模式。然后使用 CSS3 应用基于 :valid 或 :invalid 响应的样式，为用户提供视觉反馈。注意：在所有字段都有效之前，不会提交表单。

此外，请尝试在您的 <form> 标记中使用 <ul> 而不是 <p> 来订购您的表单元素。