如何使用 JavaScript 阻止页面加载
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17844919/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to stop a page from loading with JavaScript
提问by amir moradifard
I have a Button with PostBackUrl. Also I have assigned a function to its onclientclick method in which some page logic were written including a couple of validation rules. if whole page were not valid this method returns False but I can not stop page. I have tried document.execCommand('Close') and Window.Stop() but no success.
我有一个带有 PostBackUrl 的按钮。我还为其 onclientclick 方法分配了一个函数，其中编写了一些页面逻辑，包括一些验证规则。如果整个页面无效，则此方法返回 False 但我无法停止页面。我试过 document.execCommand('Close') 和 Window.Stop() 但没有成功。
Any suggestions?
有什么建议？
Edit: Button:
编辑：按钮：
<asp:Button ID="btnSubmit" runat="server" OnClientClick="return DoLogic()" PostBackUrl="http://google.com" Class="btn_submit"/>
DoLogic:
逻辑：
function DoLogic() {
if (ValidateForm()) {
blah blah blah
return true;
}
else {
alert("Has Error");
return false;
}
ValidateForm:
验证表单：
function ValidateForm(){
if (haserror)
{
return false;
}
return true;
}
回答by Jonny Sooter
You can use .preventDefault()method on your event. This will stop the default action of a page load when the button is clicked.
您可以.preventDefault()在您的活动中使用方法。这将在单击按钮时停止页面加载的默认操作。
http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation
http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation
You can also return false;inside your DoLogic(). This will stop the page load as well.
你也可以return false;在你的DoLogic(). 这也将停止页面加载。
onclientclick="return DoLogic()"
Then in your function:
然后在你的函数中：
function DoLogic(){
//blah blah blah
return false;
}
UPDATE
更新
If you're doing all of this and are still having problems, try adding this to your button:
如果您正在执行所有这些操作但仍有问题，请尝试将其添加到您的按钮中：
onclick="javascript:return false"
UPDATE FROM OP
从 OP 更新
Your code isn't working because in the if statement you return true;and false only gets returned if the shit hits the fan (ie an error). You need to return false everytime. OR use the .preventDefault()like I mentioned earlier.
您的代码不起作用，因为在 if 语句中，您return true;和 false 仅在狗屎击中风扇时才会返回（即错误）。您每次都需要返回 false。或者使用.preventDefault()我之前提到的类似方法。
回答by Lopsided
I've read that the PostBackUrl can give you trouble, and especially in this case because it looks like you're using it wrong. I'm thinking you may be confused about what PostBackUrl does. It is an attribute used in Cross-Page posting. If you are trying to redirect the user to a different page when the postback is completed, use Response.Redirect()in the code-behind or use an <asp:HyperLink>tag instead.
我已经读到 PostBackUrl 会给您带来麻烦，尤其是在这种情况下，因为看起来您使用它是错误的。我想您可能对 PostBackUrl 的作用感到困惑。它是用于跨页面发布的属性。如果您在回发完成后尝试将用户重定向到不同的页面，请Response.Redirect()在代码隐藏中使用或改用<asp:HyperLink>标签。
There should be no reason for which you could not use Response.Redirect(). Just add it to the end of your script in the code-behind. If the client-side validation returns false, the life-cycle will not reach the server-side anyway.
您应该没有理由不能使用Response.Redirect(). 只需将其添加到代码隐藏中的脚本末尾即可。如果客户端验证返回 false，则生命周期无论如何都不会到达服务器端。
All-in-all it looks like you have at least three errors in that control:
总而言之，您在该控件中至少有三个错误：
- You definitely need the
returnpart of theOnClientClickattribute. - You need to change the
Classattribute toCssClass. - You probably need to use something other than
PostBackUrlon that button.
- 你肯定需要属性的
return一部分OnClientClick。 - 您需要将
Class属性更改为CssClass. - 您可能需要使用
PostBackUrl该按钮以外的其他东西。
You can read more about it here:
你可以在这里读更多关于它的内容：
To elaborate . . .
详细说明 。. .
If you are trying to send a user to another site when the code is finished executing, the PostBackUrlattribute cannot be used in the manner you have shown us. For instance, in your example, even if it did work, the user would likely see this:
如果您在代码执行完毕后尝试将用户发送到另一个站点，PostBackUrl则无法以您向我们展示的方式使用该属性。例如，在您的示例中，即使它确实有效，用户也可能会看到：
