如何防止子事件在JQuery中觸發

Question

所以我有一個按鈕

<input id="expandButton" type="submit" value="Expand" class="loadWindow"/>

我有兩個事件處理程序附加。

function confirmContinue() {
     return confirm("Do you want to expand window, might reload some information?");
}

$("input.loadWindow").click(function(event) {
      showProcessingWindow(event);
}

$("#expandButton").click(function(event) {
     var result = confirmContinue();
     if (!result) {
          event.preventDefault();
          event.stopPropagaton();
     }
}

如果要說“取消”，我想防止觸發“ input.loadWindow” click事件。

這就是現在正在發生的事情。 單擊按鈕->確認觸發->我單擊取消->顯示處理窗口仍觸發。

我想要按鈕單擊->確認觸發->我單擊取消->不執行任何操作。

Answer 1

看起來event.stopImmediatePropagation（）在這種情況下可以工作。

$("#expandButton").click(function(event) {
     var result = confirmContinue();
     if (!result) {
          event.preventDefault();
          event.stopImmediatePropagation(); 
     }
}

小提琴演示-http: //jsfiddle.net/w2vwn35x/1/

Answer 2

嘗試這個：

 $("#expandButton").click(function(event) { if(confirm('Do you want to expand window, might reload some information?')){ // call your function here }else{ return false; } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="expandButton" type="submit" value="Expand" class="loadWindow"/> 

Answer 3

或者，使用標志。

var doShowWindow = true;
$("#expandButton").click(function(event) {
    var result = confirmContinue();
    if (!result) {
        doShowWindow = false;
    }
});

$("input.loadWindow").click(function(event) {
    if(doShowWindow){  
        alert(1);
    }
    doShowWindow = true;
});

這是一個小提琴 。