一次單擊多次觸發JavaScript mouseup事件

Question

有人可以告訴我，為什么下面的javascript代碼一次單擊后會導致renewSession（）被調用7次嗎？

$(document).ready(function () {
    $("*").mouseup(function () {
        renewSession();
    });
});

function renewSession() {
    $.ajax({
        url: "/Account/RenewSession",
        type: "POST"
    });
}

Answer 1

可能是因為mouseup事件在DOM樹中向上傳播，並且您將處理程序應用於文檔中的每個元素。 因此，它將首先在第一個元素上觸發，然后在父元素上觸發，依此類推，直到到達html （或body ，如果沒有每次檢查，我將永遠不會記得）。

您可以使用：

$(document).ready(function () {
    $("*").mouseup(function (e) {
        e.stopPropagation();
        renewSession();
    });
});

防止多次通話。

---

編輯以解決thiag0的評論：

感謝您的快速響應...我想做的是每當用戶單擊該站點以保持會話活動時調用renewSession（）。 此解決方案可防止一次單擊即可多次調用renewSession，但可以防止觸發用戶點擊的實際意圖。 無論如何要解決這個問題？

您可以只針對body元素； 只要事件被允許通過DOM樹傳播（只要您不對單擊（或“鼠標”編輯的）元素之間的元素調用event.stopPropagation() ，那么事件將傳播到的body ，所以我建議使用：

 $(document).ready(function () { $("body").mouseup(function () { renewSession(); }); }); 

Answer 2

*選擇符匹配7個元素...

html中的事件會在DOM樹上冒出氣泡，除非明確告知要停止，因此該事件將針對與選擇器匹配的樹中的每個元素（在本例中都是所有元素）觸發。

如果這不是您的預期行為，請使用更具體的選擇器，或調用stopPropagation方法。