您现在的位置：程式碼之家 >> 編程語言 > >> 更多程式語言 >> 程式設計疑難解答

jQuery 中 return false 無法阻止 window.location.href 跳轉的解決方法

編輯：程式設計疑難解答

問題場景

頁面上所有 `` 標籤綁定了點擊事件，在處理函數中使用 `window.location.href` 進行跳轉，並返回 `false` 企圖阻止預設行為。但針對特定 ID 為 `remove` 的連結，雖然在其點擊處理函數中返回 `false`，頁面仍然跳轉了。

$("#remove").click(function(){
    var $tr = $(this).parent().parent();
    var title = $.trim($tr.find("td:first").text());
    var flag = confirm("您確定要刪除"+title+"的信息嗎？");
    if(flag){ return true; }
    return false;
});

$("a").click(function() {
    var serializeVal = $(":hidden").serialize();
    href = this.href + "&" + serializeVal;
    window.location.href = href;
    return false;
});

原因分析

return false 在 jQuery 事件處理函數中代表「阻止預設行為」並「停止冒泡」。但 window.location.href = href 是 **JavaScript 主動導向**，並非瀏覽器的預設超連結行為，因此 return false 無法阻止它。當點擊 `#remove` 時，事件冒泡到 `` 的通用處理函數，執行了 `window.location.href` 導致跳轉。

解決方案

在通用 `` 點擊處理函數中，**判斷是否為特定元素（如 `#remove`），若是則直接返回，不執行跳轉邏輯** 。

$("a").click(function () {
    if (this.id === 'return; // 直接返回，不執行後續跳轉代碼
    var serializeVal = $(":hidden").serialize();
    href = this.href + "&" + serializeVal;
    window.location.href = href;
    return false;
});