验证Javascript中的表单不起作用

沙吉尔·西迪克(Sharjeel Siddique)

我正在尝试使用JavaScript验证表单,但是代码似乎没有执行。表格正在使用php处理,效果很好。但是,验证不起作用。有人可以帮我这个忙吗?

<script>
    function validateForm(){
    var x = document.getElementById('name');
    var email = document.getElementById('email');
    var num = document.getElementById('number');
    var size = document.getElementById('size');
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    var atpos=email.value.indexOf("@"); 
    var dotpos=email.value.lastIndexOf(".");

    if (x.value == null || x.value == "") {
    alert("Please Enter your name");
    x.foucs;
    x.style.background = 'Yellow';
    return false;
    }
    if(!filter.test(email.value){
    alert('Please provide a valid email address');
    email.focus;
    email.value="";
    return false;
    }
    if(num.value == null && num.value == ""){
    alert('Please enter your mobile number');
    num.focus();
    }
    if(!isNan(num.value){
    alert('Please enter a valid number');
    num.focus();
    num.style.background();
    return false;
    }
    return false;


}
</script>

这是我的html代码。

      <form method="post" name="myForm " onsubmit="return validateForm()" action="myprocessingscript.php" >                                         
                                                <input type="text" name="name"  placeholder="Name" class="text" id="name" />
                                                                                                <input name="email" placeholder="Email" type="text"   class="text" id="email"/>

<input name="number" placeholder="Mobile Number" type="text"  class="text"  id="number"/>

<input name="size"  placeholder="Size" type="text" class="text" id="size"  />
                                                                                        <input type="Submit" value="Submit" class="button">
先生代码

工作小提琴

更正的拼写,foucs并确保所有引用都带有括号,例如:

email.focus();

如果没有括号,则不会调用该函数。它是有效的Javascript,但不会执行任何操作。

您还错过了)这里的闭幕式

if(!filter.test(email.value){
//                         ^ add another )

和这里:

if(!isNan(num.value){
//                 ^ add another )

!isNan(....)应该是isNaN(....)Javascript区分大小写,因此您不应在此处“注意”它。isNaN说“不是数字”,因此已经“被注明”。

在下面的行中,样式没有背景功能。看起来您想在此处分配值而不调用函数:

num.style.background(); // change to assign value.

在这行上,更改&&||

if(num.value == null && num.value == ""){
//                   ^ should be ||

最后,删除return false末尾的。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章