preventDefault是否正在停止傳播？

Question

使用舊版.NET Web窗體，我遇到一種情況，用戶要在給定文本框中按Enter鍵時要計算值。 效果很好，但是，Enter鍵也觸發了頁面上的默認表單提交按鈕。

我試圖通過添加event.preventDefault()來解決該問題，並將return false到文本框的事件處理程序，但是該表單是在事件發生之前提交的，因此此代碼無效。

$("input[type='text']").keypress(function (event) {
    if (event.keyCode == 13) {
        var regionId = $(this).attr("data-region-id");
        var subRegionId = $(this).attr("data-subregion-id");
        var multiplier = $(this).val();
        CalculateSales(regionId, subRegionId, multiplier);
        event.preventDefault();
        return false;
    }
});

閱讀更多內容后，我了解到可以將事件處理程序附加到默認格式，並使用preventDefault()允許事件傳播：

$("#form").on("keyup keypress", function(e) {
    var code = e.keyCode || e.which; 
    if (code  == 13) {               
        e.preventDefault();
    }
});

使用此方法，不會提交表單，但是不會處理輸入的keypress事件。 如何確保未提交表單，但輸入按鍵也能計算值？

Answer 1

不， preventDefault不會停止傳播。 這兩個功能具有完全不同的功能。

stopPropagation阻止事件沿事件鏈向上移動。

preventDefault防止在preventDefault它的事件中發生默認操作。 但是，事件仍沿鏈傳播 。

return false等同於調用preventDefault() and stopPropagation() 。 但是，調用函數是首選方法，因為您可以在函數開始時調用它們。 return false顯然只能在末尾使用，並且錯誤將阻止它運行。

這就是為什么大多數情況下您最終同時使用這兩個功能的原因。

這是您的情況， 您必須同時使用兩者 。

$("#form").on("keyup keypress", function(e) {
    var code = e.keyCode || e.which; 
    if (code  == 13) {               
        e.preventDefault();
        e.stopPropagation();
    }
});