Keskustelu: Nettisivujen teko: JavaScript: Tapahtumankäsittelijän vaihtaminen

Alkuperäinen otsikko: javascript ja funktio scopet

Nyt en vaan millään ymmärrä!

Oon koodannu pientä kikkaretta jquery:llä ja se lataa valikosta klikattaessa ajaxilla sisällöt päädivin sisälle.

kun valikkoa klikkaa, suoriutuu siitä ikään kuin kullekkin näytölle tarkoitettu pääfunktio jonka sisällä on kaikki alifunktiot. Ja näyttääkin siltä että niiden scope on eri, eli pallot-näytöstä ei pääse eikä näe kentät-näytön toimintoja.

Mutta nyt tuli ongelma. Haluan pikanapit, eli $(window).keydown(function(e) {
toiminnon jokaiseen näyttöön omansa. Eli k-kirjaimesta tapahtuu toisessa näytössä jotain ja toisessa jotain muuta.
Mutta tuohan on jotenki globaali ja nyt homma on sekaisin, toimii mistä vaan ja ihan väärin. Saako tuon jotenki pois päältä / alustettua funktioiden sisällä?

Miten selvitä tästä ?

Eli kaikessa yksinkertaisessuudessaan, mitä yrität tehdä?

Kun ikkunalle asetetaan keydown-käsittelijä, ikkunalla on keydown-käsittelijä täysin riippumatta siitä, missä se on asetettu. Ei tässä ole kysymys mistään scopesta; muuttujalla voi olla scope, mutta koodissa tehdyllä asialla ei ole scopea, jonka lopussa tekeminen peruuntuisi. Ikkuna (window) on globaali objekti, ja sille tehdyt asiat tapahtuvat ja säilyvät globaalisti, vaikka ne tehtäisiin jonkin funktion sisällä.

Yksi ratkaisu ongelmaasi olisi tallentaa funktio muuttujaan ja kutsua keydown-käsittelijässä kulloinkin muuttujaan tallennettua funktiota:

// Koodin alkuun:
var keydown_nyt = function() {}

// Johonkin vain:
$(window).keydown(function(e) {
  keydown_nyt.call(this, arguments)
})

// Sinne, missä vaihdat näyttöä eli ilmeisesti yrität vaihtaa keydownia:
keydown_nyt = function(e) {
  alert("foo")
}

Toinen vaihtoehto on poistaa vanha käsittelijä offilla aina ennen uuden asetusta:

$(window).off("keydown")
$(window).keydown(function(e) {
  alert("foo")
})

Jos ikkunalla on muitakin keydown-käsittelijöitä, voit erottaa omasi eri nimiavaruuteen:

$(window).off("keydown.pikanapit")
$(window).on("keydown.pikanapit", function(e) {
  alert("foo")
})

Kiitos!

Nyt ymmärsin.

Taitaa olla parempi niin että keydown-käsittelijä on globaali juttunsa ja se tunnistaa mikä näyttö on näkyvissä. Ja sitten vaikka switch casella toiminnot sen mukaan. Toiminnot on aina noissa jqueryn on('click) jotain näkyvää elementtiä, joten logiikkaa ei keydown-funktiossa tule olemaan paljoa.

Kenties sun ei pitäisi yrittää kuunnella ikkunan eventtejä tuossa tapauksessa vaan jotain toista elementtiä.