2016-12-13 25 views
0

Ich habe einen Eingang mit Ereignis-Listener onblur und Schaltfläche, die Ereignis-Listener haben onclick. Dies ist, wie ich esEvent-Handler funktioniert nicht

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(); 
}; 

organisiert Aber wenn der Eingang fokussiert und ich auf den Knopf am klicken, Arbeits onblur Funktion, aber Onclick-Funktion funktioniert nicht. Warum und wie kann ich das beheben?

+0

Woher wissen Sie, dass das Onclick-Ereignis nicht funktioniert? Es verhindert nur die Ereignisausbreitung. –

+0

können Sie eine Geige erstellen – CognitiveDesire

+0

Mike C. Mit Debugger; und console.log –

Antwort

1

Ihr search Rückruf sollte event in seiner Param-Liste haben. Gleiches gilt für searchFocus

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

Auch Sie vielleicht prüfen, ob Ihr DOMContentLoaded Handler feuert. Abhängig davon, wie Ihre Skripte organisiert/geladen werden, ist es möglich, dass das DOM bereits geladen wurde und dieses Ereignis ausgelöst wurde, bevor Sie den Handler registrieren. Das ist eine allgemeine Aufsicht. How to detect if DOMContentLoaded was fired