事件處理程序不起作用

Question

我有一個輸入具有事件監聽器onblur和按鈕具有事件監聽器onclick 。 這就是我的組織方式

document.addEventListener("DOMContentLoaded", function() { 
    window.searchButton = document.getElementById("searchButton");
    window.searchInput = document.getElementById("searchInput");

    searchInput.onfocus = searchFocus;
    searchInput.onblur = searchBlur;
    searchButton.onclick = search;
});

var resize = function(self, newSize) {
    self.setAttribute("size", newSize);
};

var searchFocus = function() {
    event.stopPropagation();
    resize(searchInput, 30);
};

var searchBlur = function() {
    if (searchInput.value === "") {
        resize(searchInput, 10);
    }
};

var search = function() {
    event.stopPropagation();
};

但是，當輸入內容集中並且我單擊按鈕時，onblur函數起作用，但是onclick函數不起作用。 為什么以及如何解決？

Answer 1

您的search回調應在其參數列表中包含event 。 同樣如此searchFocus

var search = function(event){
  event.stopPropagation();
};

另外，您可能想檢查DOMContentLoaded處理程序是否正在觸發。 根據您腳本的組織/加載方式，可能在您注冊處理程序之前已經加載了DOM並觸發了該事件。 這是常見的疏忽。 如何檢測DOMContentLoaded是否被觸發