为什么这个javascript验证工作不正常?

时间:2014-05-07 10:16:20

标签: javascript html regex validation

我有以下HTML代码

<form style="font-size:20px;border: 1px solid #666;font-face:'times new roman';">

        test <sub>TM</sub>
            <TABLE>

                <tr><td>Name</td><td><input type="text"name="name" id="num1"/></td></tr>

                <tr><td>E-mail id</td><td><input type="text" name="E-mail id" id="email" placeholder="abc@efg.com"/></td></tr>

                <tr><td><p>Address</p></td>
                    <div>

                        <td><textarea name="address" rows="5" cols="10" id="num3"></textarea>
                    </div>
                </tr>

                <tr><td>location</td><td><select name="location"><br>
                        <option value="kerala">kerala</option>
                        <option value="tamil nadu">tamil nadu</option></td></tr>
                        </select><br>
                <tr><td>Gender</td><td><input type="radio"name="gender" value="male">male</td></tr> <br>
                <tr><td></td><td><input type="radio"name="gender" value="female">female</td></tr><br>


                <tr><td><input type="checkbox"name="agree" value="I agree with the above information">I agree with the above information<br>
                <input type="button" value="LOGIN" onclick="letters()"/></td></tr>
            </table>
        </form>

以及以下javascript

<script type="text/javascript">
function letters() 
{
   var emailText = document.getElementById('email').value;
    //alert(emailText);
    var pattern = /^[a-zA-Z0-9\-_]+(\.[a-zA-Z0-9\-_]+)*@[a-z0-9]+(\-[a-z0-9]+)*(\.[a-z0-9]+(\-[a-z0-9]+)*)*\.[a-z]{2,4}$/;
    var x=document.getElementById("num1").value;
                //alert(x);
     var letters = /^[a-zA-Z]+$/ ;  

   if (pattern.test(emailText)==true && x.test(letters)==true) 
        {
                    alert("ok");
                    return true;
         }
    else
        {
                      alert("not ok");
                    return false;
        }
}
</script>

这个脚本的作用是,点击按钮它会调用函数letters()并根据电子邮件和字母正则表达式验证输入字段。

但为什么这不起作用?

我是javascript和html的新手,事实上我正在学习它。所以请帮忙。

3 个答案:

答案 0 :(得分:1)

请您检查一下您的问题可能在这里:

<input type="text" name="E-mail id" id="email" placeholder="abc@efg.com" id="num2">

在代码中的上述字段中定义两次id。

希望这个帮助

答案 1 :(得分:0)

从提交按钮中删除onclick()功能

把它放在你的表格的第一行

<form style="font-size:20px;border: 1px solid #666;font-face:'times new roman';" onsubmit="return letters()">

还会删除电子邮件字段中的第二个ID

<input type="text" name="E-mail id" id="email" placeholder="abc@efg.com" **id="num2"**>

答案 2 :(得分:0)

更改以下代码

if (pattern.test(emailText)==true && x.test(letters)==true) 

if (pattern.test(emailText)==true && letters.test(x)==true) 

选中此fiddle