2016-12-13 19 views
0

イベントリスナonblurとイベントリスナを持つボタンが1つあります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の機能が動作していない、それを整理する方法です。なぜ、どうすれば修正できますか?

+0

'onclick'イベントが機能しないことをどうやって知っていますか?イベントの伝播を防ぐだけです。 –

+0

あなたはフィドル – CognitiveDesire

+0

マイクC.を作成することができます。 console.log –

答えて

1

searchコールバックのパラメータリストにはeventが必要です。同じことがまたsearchFocus

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

のために真である、あなたはDOMContentLoadedハンドラが発射されていることを確認したい場合があります。スクリプトの構成/ロード方法によっては、ハンドラを登録する前にDOMが既にロードされ、そのイベントが発生している可能性があります。それは一般的な見落としです。 How to detect if DOMContentLoaded was fired

関連する問題