在调用event.preventDefault()之后,是否有一种[通用的]方法来调用默认操作?
Is there a [universal] way to invoke a default action after calling event.preventDefault()?
这个问题的目的是为了开发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);
});
- 未捕获错误:无法在初始化之前调用方法;
- 通过ajax从客户端调用C#方法来执行C#方法
- 如何避免在angular上多次调用方法;s ng重复
- React路由器错误-'无法调用方法'getRouteAtDepth'的未定义'
- 从window.onbeforeunload调用方法背后的代码
- 当输入字段为空时,如何在angular中调用方法
- 函数调用方法有什么用
- 多次调用方法后返回相同promise的模式
- 当从Chrome扩展动态注入JS时,从onload()内部调用方法
- 茉莉花 - 未调用方法
- jQuery如何在原型中调用方法
- ng显示“;调用方法“;不起作用
- Odoo销售点如何访问模型并使用JS调用方法
- 从React调用方法.JS州
- TinyMCE验证给出错误:无法调用方法'getContent'的未定义
- 向模板实例变量传递调用方法调用的结果时出现异常
- 如何在对象中调用方法
- 检查对话框是否为 Open 会引发“初始化前无法在对话框上调用方法”错误
- 在输入类型提交按钮上调用 C# 方法
- 通过类选择器单独调用方法