停止表单提交的一种方法是从JavaScript函数返回false。
当单击提交按钮时，将调用验证函数。我有一个表单验证的案例。如果满足这个条件，我调用一个名为returnToPreviousPage()的函数;
function returnToPreviousPage() {
window.history.back();
}
我正在使用JavaScript和Dojo工具包。
它不是返回到前一页，而是提交表单。我如何终止这次提交并返回到上一页?
当前回答
简单地去做....
<form>
<!-- Your Input Elements -->
</form>
这就是你的JQuery
$(document).on('submit', 'form', function(e){
e.preventDefault();
//your code goes here
//100% works
return;
});
其他回答
只需使用一个简单的按钮，而不是提交按钮。并调用JavaScript函数来处理表单提交:
<input type="button" name="submit" value="submit" onclick="submit_form();"/>
函数:
function submit_form() {
if (conditions) {
document.forms['myform'].submit();
}
else {
returnToPreviousPage();
}
}
你也可以尝试window.history.forward(-1);
Hemant和Vikram的回答在Chrome浏览器中并不完全适用。event.preventDefault ();脚本阻止页面提交，无论是否通过验证。相反，我必须移动event.preventDefault();输入if语句，如下所示:
if(check if your conditions are not satisfying)
{
event.preventDefault();
alert("validation failed false");
returnToPreviousPage();
return false;
}
alert("validations passed");
return true;
}
感谢赫曼特和维克拉姆让我走上正轨。
您可以使用该函数的返回值来阻止表单提交
<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字段为假，让它工作。
谢谢Sam分享信息。
编辑:
感谢Vikram的解决方法，如果validateMyForm()返回false:
<form onsubmit="event.preventDefault(); validateMyForm();">
其中validateMyForm()是一个函数，如果验证失败则返回false。关键是使用名称事件。我们不能使用例如e.c epreventdefault ()
简单地去做....
<form>
<!-- Your Input Elements -->
</form>
这就是你的JQuery
$(document).on('submit', 'form', function(e){
e.preventDefault();
//your code goes here
//100% works
return;
});
你所有的回答都给了我一些参考。
最后，这为我工作:(如果你不选择至少一个复选框项目，它警告并保持在同一页面)
<!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>
