Fatal编程技术网
  • javascript/
  • “明确”的必要性是什么；return"；在使用Javascript的表单中使用onsubmit时的关键字？

“明确”的必要性是什么；return"；在使用Javascript的表单中使用onsubmit时的关键字？

javascript forms validation

“明确”的必要性是什么；return"；在使用Javascript的表单中使用onsubmit时的关键字？,javascript,forms,validation,return,onsubmit,Javascript,Forms,Validation,Return,Onsubmit,我有C/C++编程背景，在通过JS上的@3C网页随意学习Javascript时，我发现这段代码- <html> <head> <script type="text/javascript"> function validateForm() { var x=document.forms["myForm"]["email"].value; var atpos=x.indexOf("@"); var dotpos=x.lastIndexOf("."); if (atp

我有C/C++编程背景，在通过JS上的@3C网页随意学习Javascript时，我发现这段代码-

<html>
<head>
<script type="text/javascript">
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;
  }
}
</script>
</head>

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


函数validateForm（）
{
var x=document.forms[“myForm”][“email”].value；
var atpos=x.indexOf（“@”）；
var dotpos=x.lastIndexOf（“.”）；

如果（atposwell）如果函数返回false，则事件被取消


onsubmit="return validateForm();"


在某种程度上相当于


onsubmit="if(!validateForm()) stop the event"


当然，还有其他（更干净的）停止事件dom传播的方法：


function stopEvent(event){
    if(event.preventDefault)
         event.preventDefault();
    if(event.stopPropagation)
         event.stopPropagation();
    event.cancelBubble = true;
}


然后将其用于事件处理程序：


onsubmit = function(e){
    if(!validateForm())
        stopEvent(e);
}



不需要HTML中的
返回值
。对于记录而言，以编程方式附加事件既美观又功能强大：


<html>
    <head>
    <script type="text/javascript">

        var myForm = document.getElementById("myForm");

        myForm.onsubmit = function() {
            var x = 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;
            }
        };
    </script>
    </head>
    <body>
        <form id="myForm" action="demo_form.asp" method="post">
            <label>
                Email:
                <input type="text" name="email">
            </label>
            <input type="submit" value="Submit">
        </form>
    </body>
</html>




var myForm=document.getElementById（“myForm”）；
myForm.onsubmit=函数（）{
var x=myForm[“email”]。值；
var atpos=x.indexOf（“@”）；
var dotpos=x.lastIndexOf（“.”）；
如果（atpos<1 | | dotpos=x.length）{
警报（“不是有效的电子邮件地址”）；
返回false；
}
};
电邮：

好的，似乎出现了一些误导性的答案，因此我将尝试提供一个解释。符号
被翻译为：


element.onsubmit = function (event) {
    with (document) {
        with (this) {
            handler_body
        }
    }
};


<>（我们将忽略< <代码> >相关的内容，这里不重要。现在，考虑<代码>验证模板（）/<代码>函数返回<代码> false <代码>。如果使用<代码> OnStase=“返回验证模板（））<代码>，随后明显变成OnStase=“返回false”< /C> >，您的处理程序将变为


element.onsubmit = function () {
    return false;
};


当触发
submit
事件时（就像浏览器内部调用
element.onsubmit（）
），
element.onsubmit（）
返回
false
，因此默认值被抑制

但是，如果只使用
onsubmit=“validateForm（）；”
，则事件处理程序如下所示


element.onsubmit = function () {
    false;
};


在这种情况下，
false
只是一个语句。
element.onsubmit（）
不返回任何内容，从事件处理程序返回
未定义的
不足以阻止默认行为


@Simeon告诉我们“HTML中的return是不需要的”，但他实际上也在他的代码中使用了
return false
。
我相信每个人都差不多回答了这个问题，但是用了不同的方式。谢谢大家

我碰巧在网上读到了一篇优秀的文章，文章很好地解释了实际发生的事情，主要是在幕后，使用了一个与我发布的问题非常相似的例子

我觉得这对将来可能面临这一问题的任何人都有用

链接到文章-
http://www.quirksmode.org/js/events_early.html

阅读页面的“防止默认设置”部分


--阿伦·奈尔（arun nair）
你有没有一个显示行为差异的jsFiddle？这会帮助我理解…@NimChimpsky
return false
at vs.
false
at。如果默认行为被阻止，你应该呆在同一页面上，而不是被重定向到谷歌。西蒙，我相信这就是答案，尽管我还没有回答st这是否有效。AFAIK，此编程事件处理将从代码中删除该“额外”返回。@duri-Simeon指的是“html”中的“额外”返回。javascript函数中的另一个“返回”仍然存在。对我来说，这似乎是答案（只要它有效），因为onsubmit=“return false”看起来还是有点偏僻。谢谢大家！

element.onsubmit = function () {
    false;
};