在调用event.preventDefault()之后,是否有一种[通用的]方法来调用默认操作?

Is there a [universal] way to invoke a default action after calling event.preventDefault()?

本文关键字:调用 方法 默认 操作 之后 preventDefault event 是否 一种      更新时间:2023-09-26

这个问题的目的是为了开发jQuery插件和其他自包含的JavaScript代码片段,这些代码片段不需要修改其他脚本文件以保持兼容性。

我们都知道event. preventdefault()会阻止默认事件,所以我们可以运行自定义函数。但是,如果我们想在调用默认事件之前简单地延迟该怎么办呢?我已经看到了各种特定于案例的忍者技巧和变通方法来重新调用默认操作,但就像我说的,我感兴趣的是一种通用的方式来重新触发默认操作,而不是逐个处理默认触发器。

$(submitButton).click(function (e) {
    e.preventDefault();
    // Do custom code here.
    e.invokeDefault(); // Imaginary... :(
});

即使是像表单提交这样简单的事情,似乎也没有一个通用的答案。$(selector).closest("form").submit()的解决方案假设默认操作是标准的表单提交,而不是像ASP.NET中的__doPostBack()函数那样古怪的操作。到调用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, ""));
}

我想我可以开始写一些特殊的案例来处理window.location重定向的正常链接,但这样我们就打开了一个全新的蠕虫罐头——为默认事件调用堆积越来越多的案例产生的问题比解决方案更多。

怎么样?谁有我一直在寻找的灵丹妙药?

首先不要调用preventDefault()。那么默认动作将在事件处理程序之后发生。

看看这个:

你可以试试

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);
}

如何在JavaScript中触发事件?和jQuery事件参考:http://api.jquery.com/category/events/event-object/

标记你收到的事件对象,这样如果你再次收到它,你就不会循环。

应该可以。不过我只在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>

当然,您还必须复制所有旧的事件变量属性。我只是没有对这部分进行编码,但它应该足够简单。

这是不可能的,JamWaffles已经证明了这一点。简单解释一下为什么不可能:如果你重新触发默认动作,你的事件监听器再次拦截,你就会有一个无限循环。

click(function (e) {
    e.preventDefault();
    // Do custom code here.
    e.invokeDefault(); // Imaginary... :(
});

和下面的(虚函数)是一样的

click(function (e) {
    // Do custom code here.
});

看起来您想要操作您所单击的元素的url。如果你像这样做,它就会很好。例子。

我需要在点击后禁用按钮,然后触发默认事件,这是我的解决方案

$(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);
});