停止表单提交的 JavaScript 代码-forms-IT问答社区-解决你的IT疑问

停止表单提交的 JavaScript 代码

LulY 2月前

停止表单提交的一种方法是从 JavaScript 函数返回 false。单击提交按钮时，将调用验证函数。我有一个表单验证案例。如果该条件...

停止表单提交的一种方法是从 JavaScript 函数返回 false。

单击提交按钮时，将调用验证函数。我有一个表单验证案例。如果满足该条件，我会调用一个名为 returnToPreviousPage() 的函数；

function returnToPreviousPage() {
    window.history.back();
}

我正在使用 JavaScript 和 Dojo Toolkit .

它提交表单而不是返回上一页。我怎样才能中止提交并返回上一页？

帖子版权声明 1、本帖标题：停止表单提交的 JavaScript 代码
本站网址：http://xjnalaquan.com/
2、本网站的资源部分来源于网络，如有侵权，请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点，并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
5、站长邮箱：yeweds@126.com 除非注明，本帖由LulY在本站《forms》版块原创发布，转载请注明出处！

最新回复 (0)

最新倒序只看楼主

argyle 2月前 0 只看Ta

引用 2楼

RU 确定这个函数正在调用？？尝试将 alert('test'); 放在 window.history 之前
user8229029 2月前 0 只看Ta

引用 3楼
有很多方法可以实现它。

可以使用preventDefault（）和validateForm（）
```
<form onsubmit="event.preventDefault(); validateMyForm();">
```
如果验证失败，validateMyForm() 将返回 false。

您还可以使用函数的返回值来阻止表单提交
```
<form name="myForm" onsubmit="return validateMyForm();"> 
```
并发挥类似功能
```
<script type="text/javascript">
function validateMyForm()
{
  if(check if your conditions are not satisfying)
  { 
    alert("validation failed false");
    returnToPreviousPage();
    return false;
  }

  alert("validations passed");
  return true;
}
</script>
```
如果 Chrome 27.0.1453.116 m 中上述代码不起作用，请将事件处理程序的参数的 returnValue 字段设置为 false 以使其起作用。

感谢 Sam 分享信息。
Adam 2月前 0 只看Ta

引用 4楼

返回 false 的任何内容似乎都没有任何效果；Chrome 仍会提交表单。例如，onsubmit=\'return false;\'。但是，将事件处理程序的参数的 returnValue 字段设置为 false 对我来说是有效的。
tmaj 2月前 0 只看Ta

引用 5楼

你好，Sam/Hemant，您能否提供代码示例，说明如何将事件处理程序的参数的 returnValue 字段设置为 false。
Robert Casey 2月前 0 只看Ta

引用 6楼

我认为既然这是公认的答案，它应该会告诉你如何正确地做到这一点。我和 JackDev 都在想如何让它正常工作。事实上，这不起作用
hellnow 2月前 0 只看Ta

引用 7楼

如果validateMyForm()有错误，则不会返回false。所以这可能会失败。经过几个小时，我找到了一个可行的解决方案并将其发布在下面。
hhoke1 2月前 0 只看Ta

引用 8楼
使用防止默认

Dojo 工具包
```
dojo.connect(form, "onsubmit", function(evt) {
    evt.preventDefault();
    window.history.back();
});
```
jQuery
```
$('#form').submit(function (evt) {
    evt.preventDefault();
    window.history.back();
});
```
原始 JavaScript
```
if (element.addEventListener) {
    element.addEventListener("submit", function(evt) {
        evt.preventDefault();
        window.history.back();
    }, true);
}
else {
    element.attachEvent('onsubmit', function(evt){
        evt.preventDefault();
        window.history.back();
    });
}
```
Yair_May 2月前 0 只看Ta

引用 9楼

出于很多原因，我会推荐使用 event.preventDefault() 而不是 return false，这应该是最佳答案：blog.nmsdvid.com/…
Sunshine Li 2月前 0 只看Ta

引用 10楼
目前为止，以下内容有效（在 Chrome 和 Firefox 中测试）：
```
<form onsubmit="event.preventDefault(); validateMyForm();">
```
其中validateMyForm()是验证失败时返回的函数 false 。关键点是使用名称 event 。我们不能使用例如 e.preventDefault() .
Gonçalo Figueiredo 2月前 0 只看Ta

引用 11楼
根据@Vikram Pudi 的回答，我们也可以使用纯 Javascript 来实现这一点，
```
<form onsubmit="submitForm(event)">
    <input type="text">
    <input type="submit">
</form>

<script type="text/javascript">

    function submitForm(event){
        event.preventDefault();


    }
</script>
```
brenda 2月前 0 只看Ta

引用 12楼
只需使用一个简单的 button 提交按钮即可。并调用 JavaScript 函数来处理表单提交：
```
<input type="button" name="submit" value="submit" onclick="submit_form();"/>
```
内的功能 script ：
```
function submit_form() {
    if (conditions) {
        document.forms['myform'].submit();
    }
    else {
        returnToPreviousPage();
    }
}
```
您也可以尝试 window.history.forward(-1);
Jukka 2月前 0 只看Ta

引用 13楼

这会阻止使用 Enter 键提交表单。此外，诸如 required 之类的新 HTML5 属性将不起作用。
Hossein Abedi 2月前 0 只看Ta

引用 14楼
做一件简单的事情有很多困难的方法：
```
<form name="foo" onsubmit="return false">
```
Shubhankar Pande 2月前 0 只看Ta

引用 15楼

这个确切的答案（好吧，不确切，因为你的答案少了一个分号）是在 8 个月前提交的，并且有充分理由遭到反对。这在大多数情况下都有效。但并非在所有浏览器上都有效。
aynber 2月前 0 只看Ta

引用 16楼

我并没有说你需要一个分号；我指出，这就是你的答案与一个更早的答案之间的唯一区别。你现在要求我指出哪些浏览器不支持它（我从未说过有，我只是指出它并不总是有效），这证明你还没有读完整个页面。
E_Blue 2月前 0 只看Ta

引用 17楼

我通常不检查否决票，只是我不知道人们在否决正确的代码。从技术上讲，分号是多余的，所以它是错误的。你说“你的代码缺少分号”，暗示它是必需的，这是错误的。你说它“不会总是有效”，但你不能指出一个它不起作用的情况或浏览器？这是合理的逻辑吗？这是正确的代码。所以除非你能指出它不起作用的情况，否则你根本就没有道理。

Malte Rothkamm 2月前 0 只看Ta

18楼

您的所有答案都提供了一些参考。

最后，这对我有用：（如果您没有选择至少一个复选框项，它会发出警告并停留在同一页面）

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <form name="helloForm" action="HelloWorld" method="GET"  onsubmit="valthisform();">
            <br>
            <br><b> MY LIKES </b>
            <br>
            First Name: <input type="text" name="first_name" required>
            <br />
            Last Name: <input type="text" name="last_name"  required />
            <br>
            <input type="radio" name="modifyValues" value="uppercase" required="required">Convert to uppercase <br>
            <input type="radio" name="modifyValues" value="lowercase" required="required">Convert to lowercase <br>
            <input type="radio" name="modifyValues" value="asis"      required="required" checked="checked">Do not convert <br>
            <br>
            <input type="checkbox" name="c1" value="maths"     /> Maths
            <input type="checkbox" name="c1" value="physics"   /> Physics
            <input type="checkbox" name="c1" value="chemistry" /> Chemistry
            <br>

            <button onclick="submit">Submit</button>

            <!-- input type="submit" value="submit" / -->
            <script>
                <!---
                function valthisform() {
                    var checkboxs=document.getElementsByName("c1");
                    var okay=false;
                    for(var i=0,l=checkboxs.length;i<l;i++) {
                        if(checkboxs[i].checked) {
                            okay=true;
                            break;
                        }
                    }
                    if (!okay) { 
                        alert("Please check a checkbox");
                        event.preventDefault();
                    } else {
                    }
                }
                -->
            </script>
        </form>
    </body>
</html>

tru 2月前 0 只看Ta

引用 19楼
我建议不要使用 onsubmit ，而是在脚本中附加一个事件。
```
var submit = document.getElementById("submitButtonId");
if (submit.addEventListener) {
  submit.addEventListener("click", returnToPreviousPage);
} else {
  submit.attachEvent("onclick", returnToPreviousPage);
}
```
然后使用 preventDefault() （或 returnValue = false 对于旧版浏览器）。
```
function returnToPreviousPage (e) {
  e = e || window.event;
  // validation code

  // if invalid
  if (e.preventDefault) {
    e.preventDefault();
  } else {
    e.returnValue = false;
  }
}
```
Kim Kern 2月前 0 只看Ta

引用 20楼

也许这只是个人偏好问题，但我发现如果所有事件监听器都使用 JS 而不是使用 HTML 属性来附加，那么更容易理解网页的功能。这样，你在阅读别人的代码时就不需要来回跳转了

关于作者

LulY

UID:8203一级用户组

主题数
0

帖子数
0

精华数
0

注册排名
8203

导航

论坛

我的

停止表单提交的 JavaScript 代码

LulY

TAG

作者主题

作者最近主题：