如何准確找出引發事件的原因？

Question

我在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）鏈接中的偶數觸發器也無法使用...

Answer 1

您可以使用event.target.id選擇器傳遞觸發事件的元素，如下所示：

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

參見jsfiddle 。 正如評論員提到的那樣，這將提醒用於選擇的元素的ID，我只是以它為例，因為您沒有完全說明要檢索的內容？

Answer 2

使用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"); } } 

請注意，此示例使用的是所謂的Event Namespacing 。 通過指定我們要偵聽beforeunload事件，但我們擁有自己的命名空間override ，我們可以安全地添加和刪除事件處理程序，而無需刪除beforeunload事件的所有其他偵聽器。

Answer 3

如果您想了解有關活動的所有信息，可以按照@Aesthete的建議進行。

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

然后，您可以查看控制台並檢查輸出事件。

Answer 4

使用target="_blank"可以解決此問題：

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

這很丑陋，但就我而言，這是唯一可在所有瀏覽器上完美運行的解決方案。