Javascript 在调用 event.preventDefault() 后，是否有 [通用] 方法来调用默认操作？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7732854/
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
Is there a [universal] way to invoke a default action after calling event.preventDefault()?
提问by Jake
This question is for the purposes of developing jQuery plugins and other self-contained JavaScript snippets that don't require modifying other script files for compatibility.
这个问题是为了开发 jQuery 插件和其他不需要修改其他脚本文件以实现兼容性的自包含 JavaScript 片段。
We all know that event.preventDefault() will prevent the default event so we can run a custom function. But what if we want to simply delaythe default event before invoking it? I've seen various, case-specific ninja tricks and workarounds to re-invoke the default action, but like I said, my interest is in a universal way to re-trigger the default, and not deal with default triggers on a case-by-case basis.
我们都知道 event.preventDefault() 将阻止默认事件，因此我们可以运行自定义函数。但是如果我们想在调用它之前简单地延迟默认事件呢？我已经看到了各种特定于案例的忍者技巧和变通方法来重新调用默认操作，但就像我说的，我的兴趣在于重新触发默认值的通用方式，而不是处理案例中的默认触发器-个案基础。
$(submitButton).click(function (e) {
e.preventDefault();
// Do custom code here.
e.invokeDefault(); // Imaginary... :(
});
Even for something as simple as form submission, there seems to be no universal answer. The $(selector).closest("form").submit()workaround assumes that the default action is a standard form submission, and not something wacky like a __doPostBack()function in ASP.NET. To the end of invoking ASP.NET callbacks, this is the closest I've come to a universal, set-it-and-forget-it solution:
即使对于表单提交这样简单的事情，似乎也没有统一的答案。该$(selector).closest("form").submit()解决方法假定默认的动作是一个标准的表单提交，而不是古怪像__doPostBack()在ASP.NET功能。在调用 ASP.NET 回调结束时，这是我最接近通用的、设置即忘的解决方案：
$(submitButton).click(function (e) {
e.preventDefault();
// Do custom code here.
var javascriptCommand = e.currentTarget.attributes.href.nodeValue;
evalLinkJs(javascriptCommand);
});
function evalLinkJs(link) {
// Eat it, Crockford. :)
eval(link.replace(/^javascript:/g, ""));
}
I suppose I could start writing special cases to handle normal links with a window.locationredirect, but then we're opening a whole new can of worms--piling on more and more cases for default event invocation creates more problems than solutions.
我想我可以开始编写特殊情况来处理带有window.location重定向的正常链接，但随后我们正在打开一个全新的蠕虫罐——堆积越来越多的默认事件调用案例会产生比解决方案更多的问题。
So how about it? Who has the magic bullet that I've been searching for?
那么怎么样呢？谁有我一直在寻找的灵丹妙药？
回答by Mike Edwards
Take a look at this one:
看看这个：
You could try
你可以试试
if(!event.mySecretVariableName) {
event.preventDefault();
} else {
return; // do nothing, let the event go
}
// your handling code goes here
event.originalEvent.mySecretVariableName = "i handled it";
if (document.createEvent) {
this.dispatchEvent(event.originalEvent);
} else {
this.fireEvent(event.originalEvent.eventType, event.originalEvent);
}
Using this answer: How to trigger event in JavaScript?and the jQuery event reference: http://api.jquery.com/category/events/event-object/
使用这个答案：如何在 JavaScript 中触发事件？和 jQuery 事件参考：http: //api.jquery.com/category/events/event-object/
Tag the event object you receive so if you receive it again you don't loop.
标记您收到的事件对象，因此如果您再次收到它，您就不会循环。
回答by Ben
Don't call preventDefault()in the first place. Then the default action will happen after your event handler.
首先不要打电话preventDefault()。然后默认操作将在您的事件处理程序之后发生。
回答by Azmisov
This should work. I've only tested in firefox though.
这应该有效。我只在 Firefox 中测试过。
<html>
<head>
<script>
window.addEventListener("click",handleClick,false);
function handleClick(e){
if (e.useDefault != true){
alert("we're preventing");
e.preventDefault();
alert(e.screenX);
//Firing the regular action
var evt = document.createEvent("HTMLEvents");
evt.initEvent(e.type,e.bubbles,e.cancelable);
evt["useDefault"] = true;
//Add other "e" attributes like screenX, pageX, etc...
this.dispatchEvent(evt);
}
else{
alert("we're not preventing");
}
}
</script>
</head>
<body>
</body>
</html>
Of course, you'd have to copy over all the old event variables attributes too. I just didn't code that part, but it should be easy enough.
当然，您也必须复制所有旧的事件变量属性。我只是没有编码那部分，但它应该很容易。
回答by styrr
It's not possible like JamWaffles has already proven. Simple explanation why it's impossible: if you re-trigger the default action your event listener intercept again and you have an infinite loop.
不可能像 JamWaffles 已经证明的那样。为什么不可能的简单解释：如果您重新触发默认操作，您的事件侦听器将再次拦截，并且您将陷入无限循环。
And this
和这个
click(function (e) {
e.preventDefault();
// Do custom code here.
e.invokeDefault(); // Imaginary... :(
});
is the same like this (with your imaginary function).
是这样的（用你的虚函数）。
click(function (e) {
// Do custom code here.
});
It seems that you want to manipulate the url of your clicked element. If you do it like this it just works fine. Example.
似乎您想操纵您单击的元素的 url。如果你这样做，它就可以正常工作。例子。
回答by Tomá? Tibensky
I needed to disable a button after click and then fire the default event, this is my solution
我需要在点击后禁用一个按钮，然后触发默认事件，这是我的解决方案
$(document).on('click', '.disabled-after-submit', function(event) {
event.preventDefault();
$(event.currentTarget).addClass('disabled');
$(event.currentTarget).removeClass('disabled-after-submit');
$(event.currentTarget).click();
$(event.currentTarget).prop('disabled', true);
});
