Question

javascript：

    function validateForm()
{
    var x=document.forms["newsletter"]["agree"].value;
    if (newsletter.agree.checked != 1)
    {
        alert("Checkbox must be checked");
        return false;
    }


    var y=document.forms["newsletter"]["email"].value;
    var atpos=y.indexOf("@");
    var dotpos=y.lastIndexOf(".");
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=y.length)
    {
      alert("Not a valid e-mail address");
      return false;   
    }

    else 
    {   
        return true;
    }
}

我的HTML

<div id="signup">
<form id="newsletter" action="" method="get" onsubmit="return validateForm()">
<fieldset>
<p>Email: <input type="text" name="email" size="35"/>
Please send me the monthly newsletter 
<input type="checkbox" checked="checked" name="agree" value=""/>
<br/>
<input type="submit" value="Signup"/></p>
</fieldset>
</form>
</div><!-- signup -->

当我点击Chrome中的无效条目提交时，会显示提醒消息，表单也不会提交。但是，当我在Firefox中执行相同操作时，表单会在没有警报消息的情况下提交。

我已经为此工作了5个小时，我真的不知道。感谢您的帮助，非常感谢。

Answer 1

我认为它可能对你有所帮助。

<div id="signup">
        <form id="newsletter" action="" method="get" onsubmit="return validateForm()">
        <fieldset>
        <p>Email: <input type="text" name="email" id="email" size="35"/>
        Please send me the monthly newsletter 
        <input type="checkbox" checked="checked" name="agree" id="agree" value=""/>
        <br/>
        <input type="submit" value="Signup"/></p>
        </fieldset>
        </form>
        </div><!-- signup -->



   function validateForm()
    {
        var agreeEl = document.getElementById("agree");
        if (agreeEl.checked != 1)
        {
            alert("Checkbox must be checked");
            return false;
        }


        var emailEl = document.getElementById("email");
        var atpos = emailEl.value.indexOf("@");
        var dotpos = emailEl.value.lastIndexOf(".");
        if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= y.length) {
          alert("Not a valid e-mail address");
        return false;   
        }

        return true;
    }

Answer 2

首先，您是否有理由使用“获取”代替“发布”来提交表单？当我尝试使用“获取”提交表单时，Chrome会向我抱怨。

我设置了一个简单的小提琴，以便在http://jsfiddle.net/jsWyw/测试您的表单。如果我使用JQuery处理表单提交而不是'onSubmit'，一切正常。所以我查看了onSubmit的内容并遇到了这个帖子：http://productforums.google.com/forum/#!topic/chrome/Z3MD5Od3oQM。

要尝试的事情：

请务必使用post而不是get
使用'onSubmit'代替'onsubmit'
确保使用<script type="text/javascript" src="javascript.js"></script>

如果失败，我建议您自己在Javascript中处理submit事件，而不是使用onSubmit，这似乎在Chrome中有点不稳定。

Answer 3

你看过你的错误控制台了吗？你的validateForm处理程序假设window.newsletter是一个表单元素（而不是在第一个if()中使用document.forms [＆＃34; newsletter＆＃34;]），它不在Firefox处于标准模式。所以该行抛出，如果一个onsubmit处理程序抛出该表单将继续提交。但当然错误控制台报告处理程序抛出.....

Answer 4

function validateForm()
{
var x=document.forms["myForm"]["email"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
}


<form name="myForm" action="demo_form.asp" onsubmit="return validateForm();" method="post">
    Email: <input type="text" name="email">
    <input type="submit" value="Submit">
</form>

我的javascript表单验证在Chrome中完美运行，但在Firefox中则无法运行

4 个答案: