如何准确地找出引发事件的原因
How to find out precisely what triggered the event?
我在jQuery中使用了一些函数,例如:
$(window).one('beforeunload', function() {
//my code
});
但我真的很想知道是什么引发了这一事件,以及是如何引发的。
我尝试了以下代码:
$(window).one('beforeunload', function(e) {
alert(JSON.stringify(e));
});
但对圆形结构提出了异议。当然,尽管肯定有一些其他的方法来区分和调试它
我该如何申请?
我想看看是什么触发了这个事件,是链接、提交的表单、javascript、页面刷新还是来回按钮等等,在这种情况下一切都很好但是如果它是由打开外部应用程序的调用触发的,我希望丢弃该事件并返回null。
外部应用程序启动示例:
<a href="skype:your_skype_name?call" >
有什么想法吗?
已解决
这就是我解决问题的方法。
我只是先做一些脚本链接,以获得对事件的更多控制:
<a href="javascript:void(0)" id="skype_click_ok"
然后我创建一个全局变量来存储beforeunload的状态:
var dontunload=0;
然后我手动处理链接,但设置location.href,并更改变量状态:
$('#skype_click_ok').click(function(){
dontunload=1;
location.href='skype:marilynbrusas?call';
});
现在我实际的beforeunload事件,注意one()
也被更改为bind()
:
$(window).bind('beforeunload', function() {
if (dontunload==1) dontunload=0; //if triggered from our skype - do nothing, yet cancel state for the next call
else { //Do the actual code
// Fade out, before leaving the page.
$('html#my_html').stop(true,false).css('overflow','hidden').animate({opacity:0},2000);
// Lock content with invalid image hack
$('body#my_body').prepend(
$('<div>').attr({style:'position:fixed;height:100%;width:100%;left:0;top:0;z-index:900100;background-image:url(in-your-face)'})
);
// unbind the event
$(this).unbind('beforeunload');
}
});
EDIT3
事实上,它还没有解决。这个技巧在IE中不起作用,甚至在javascript的触发器中也不起作用:void(0)链接。。。
您可以使用event.target.id
选择器传递触发事件的元素,如下所示:
$(document).ready(function() {
$("a").click(function(event) {
alert(event.target.id);
});
});
参见jsfiddle。正如评论者所提到的,这将提醒用于选择的元素的ID,我只是举了一个例子,因为你没有完全说明你想要检索什么?
使用alert
来显示事件之类的对象是非常无用的。
为什么不尝试将事件发送到控制台?
function(event) {
console.log(event);
}
通过这种方式,您可以展开事件对象并以树状结构查看它。
EDIT根据您对事件触发器位置的评论:我还没有对此进行测试,但这可能是停止卸载事件的一种方法。
- 侦听所有
a
元素的单击事件 - 检查单击的元素是否指向外部应用程序(不是以http://开头)
- 如果没有,请为
beforeunload
绑定一个事件处理程序,该处理程序将立即取消该事件 否则,取消绑定上一个处理程序
$("a").click(function(event) { if(event.target.href.indexOf("http://") != 0) { $(window).on("beforeunload.override", function(e) { // Stop the 'beforeunload' event. return false; } } else { $(window).off("beforeunload.override"); } }
请注意,此示例使用的是一个名为EventNamespacing的东西。通过指定我们想要侦听beforeunload
事件,但我们有自己的名为override
的命名空间,我们可以安全地添加和删除事件处理程序,而无需删除beforeunload
事件的所有其他侦听器。
使用target="_blank"
也解决了这个问题:
<a href="skype:your_skype_name?call" target="_blank">
它相当丑陋,但在我的情况下,它是唯一一个在所有浏览器上都能完美工作的解决方案。
- 分派点击事件并保留击键修饰符
- 模糊事件的Javascript测试
- keyup事件处理程序更改焦点不适用于快速键入
- 使用 jQuery 的 .on 函数如何获取事件的原始元素
- 如何使Javascript动态html表及其上的事件
- 使用类从一个标记中双击事件
- 如何在未直接触发的情况下停止事件
- 如何在elfinder插件(一个文件管理器插件)上获得上传前事件
- 对iPad上的点击事件反应缓慢
- 事件和状态
- Fancybox是否将Click事件静音
- 主干-不管怎样,检查事件以前是否绑定过
- 从控制器返回后Ajax启动事件激发
- 如何从画布上的某个移动事件中获取X和Y
- 如何准确地找出引发事件的原因
- CreateJS的PreloadJS进度事件不准确
- 在《春面孔》中,点击事件从何而来
- 在谷歌地图's JS API fromPointToLatLng没有'根据事件来看似乎并不准确
- 反应式编程与事件驱动编程有何不同
- 这三种监听事件的方式的作用域有何不同