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

时间:2011-10-11 21:38:24

标签: javascript jquery

这个问题是为了开发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重定向的普通链接,但是我们正在打开一整套新的蠕虫 - 在越来越多的情况下堆积默认事件调用会产生更多问题而非解决方案。

那怎么样?谁拥有我一直在寻找的神奇子弹?

5 个答案:

答案 0 :(得分:10)

看一下这个:

你可以尝试

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

使用此答案:How to trigger event in JavaScript?和jQuery事件参考:http://api.jquery.com/category/events/event-object/

标记您收到的事件对象,如果再次收到它,则不要循环。

答案 1 :(得分:8)

首先不要致电preventDefault()。然后默认操作将在您的事件处理程序之后发生。

答案 2 :(得分:4)

这应该有效。我只是在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>

当然,您还必须复制所有旧的事件变量属性。我只是没有编写那部分代码,但它应该很容易。

答案 3 :(得分:1)

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

这个

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

与此相同(使用您想象的功能)。

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

您似乎想要操纵所点击元素的网址。如果你这样做它只是工作正常。 Example

答案 4 :(得分:0)

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

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