如何准确找出触发事件的原因？

我使用的一些功能使用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触发：无效（0）链接...

来源

2012-09-05 Anonymous

打开外部应用程序的调用？请你能更好地解释一下吗？ –

'' - 这确实会触发GET，因此会触发before-unload事件。外部应用程序意味着它有一个内部协议，而不是'http：'，例如'skype：'。所以它会尝试启动一个Skype应用程序，而不是在网络上打开一些页面。如果是这样的话，我确实想取消我的活动。 – Anonymous

使用alert像事件显示对象是相当无用的。

你为什么不尝试给控制台发送活动？

function(event) { 
    console.log(event); 
}

这样就可以扩大你事件对象，并认为它像结构树。

编辑根据你对事件触发器的位置的评论：我没有测试过这个，但这可能是一种停止你的卸载事件的方法。

倾听所有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"); 
    } 
}

请注意，此示例正在使用某种呼叫事件命名空间。通过指定我们想要收听beforeunload事件，但我们有我们自己的名为override的名称空间，我们可以安全地添加和删除事件处理程序，而不必删除beforeunload事件的所有其他侦听器。

来源

2012-09-05 21:58:46 Aesthete

地狱，这正是我想要的，属性列表，不只是ID或标签名称。现在我只需要找出一个很好的方法来捕获外部应用程序调用。 – Anonymous

是的我仍然不是100％确定你的意思，但我做了一些编辑，可能会有所帮助。 – Aesthete

这是棘手的。问题是一个href不会直接触发beforeunload事件。相反，我确实将'HTMLDocument'作为一个event.target ...好处是你明白我现在想要达到的目标。 – Anonymous

可以使用event.target.id选择传递什么因素触发事件，像这样：

$(document).ready(function() { 
    $("a").click(function(event) { 
     alert(event.target.id); 
    }); 
});

见jsfiddle。作为评注中提到，这将提醒用来选择元素的ID，我只是用它作为例子，你并没有完全说出你就想获取什么呢？

来源

2012-09-05 21:53:45

那么这将获得目标ID - 如果你删除ID部分将获得触发事件+1的元素，尽管 –

我知道如何使用event.target获取元素。但我宁愿记录事件的所有属性，我想要调试它，有时仅仅通过这种简单化的方法是不够的。 – Anonymous

如果您想了解事件的一切，你可以按照@Aesthete

的提醒

$('#id').click(function(e){ 
     console.log(e) 
      });

然后你可以查看控制台和检查输出事件。

来源

2012-09-05 22:16:45

我这样做，但没有必要复制相同的答案。 :) – Anonymous

通过检查输出事件e你会选择event.target.href属性，这就是要使用控制台 –

使用target="_blank"解决了这个问题，以及：

<a href="skype:your_skype_name?call" target="_blank">

这是相当难看，但对我来说这是只有在所有浏览器完美地工作的解决方案。

来源

2014-07-24 15:54:09 pstadler

如何准确找出触发事件的原因？

回答

相关问题