jQuery 動態綁定 click 事件失效排查：元素未就緒與語法錯誤

常見原因

1. 腳本執行時目標元素尚未渲染：將代碼放在頁面底部或包裹在 $(document).ready() 中。
2. 使用事件委託綁定動態元素：父容器必須存在，選擇器正確。

修正後代碼

$(document).ready(function() {
    // 使用文檔委託確保動態添加的 .am-pic-minus 也生效
    $(document).on("click", ".am-pic-minus", function() {
        var $img = $("div i img");
        var pic_address = $img.attr("src");
        alert(pic_address);

        $(this).parent().remove();

        $.ajax({
            type: "POST",
            data: { pic_address: pic_address },
            url: "/PublishController/doUpdate",
            dataType: 'json',
            success: function(data) {
                alert("刪除成功");
                window.location.reload();
            },
            error: function() {
                alert("刪除失敗，請稍候重試");
            }
        });
    });
});

關鍵修正點

• 包裹在 $(document).ready() 確保 DOM 就緒。
• 使用 $(document).on(...) 委託綁定，支持後續動態添加的元素。
• 修正 AJAX 回調：原代碼 else 語法錯誤，改為 error 回調處理失敗。
• 變量 pic_address 在 remove() 前獲取，避免元素移除後找不到。

調試建議

打開瀏覽器開發者工具 Console 面板，查看是否有 JavaScript 錯誤阻斷後續執行。