ToBiOh: document.getElementById is null

Die Javascript Konsole in Firefox sagt mir bei folgendem Script die ganze Zeit dass "curbutton" null ist:

	  
function initbuttons() {  
var curbutton, wordxbuttons;  
  
wordxbuttons = [ {name: 'wordxbold', cmd: 'bold', img: 'bold', title: 'Fett'},  
			     {name: 'wordxitalic', cmd: 'italic', img: 'italic', title: 'Kursiv'}];  
  
for each (var xbutton in wordxbuttons) {  
 curbutton = document.getElementById(xbutton.name);  
 curbutton.unselectable = "on";  
 curbutton.onmousedown = function() { curbutton.src = ('images/wordx/active/' + xbutton.img + '.gif'); if (evt.preventDefault) evt.preventDefault() };  
 curbutton.src = ('images/wordx/normal/' + xbutton.img + '.gif');  
 curbutton.alt = xbutton.title;  
 curbutton.title = xbutton.title;  
 curbutton.onclick = wordxcmd(xbutton.cmd);  
 curbutton.onmouseover = function () { curbutton.src = ('images/wordx/hover/' + xbutton.img + '.gif') };  
}  
  
}

Dabei ist das absoluter Unsinn. "curbutton" ist im Dokument wie folgt ausgeschrieben: "<img src="" id="wordxbold" alt="">"
Vielleicht weiß jemand von euch Rat? Wäre für jede Hilfe dankbar.

  1. Hi!

    Fällt Dir etwas auf?

    curbutton = document.getElementById(xbutton.name);

    }

      
      
    Name oder id?  
      
    off:PP  
      
      
    
    -- 
    "You know that place between sleep and awake, the place where you can still remember dreaming?" (Tinkerbell)  
    
    
    1. Das heißt nur name in dem array.

      1. Hi!

        Das heißt nur name in dem array.

        Sorry zu schnell geantwortet - jetzt habe ich es gesehen 'name' ist der  key in Deinem Array. Die benannte Zeile sprang mich nur direkt an.

        off:PP

        --
        "You know that place between sleep and awake, the place where you can still remember dreaming?" (Tinkerbell)
  2. Hallo,

    Die Javascript Konsole in Firefox sagt mir bei folgendem Script die ganze Zeit dass "curbutton" null ist

    dann wird der FF wohl irgendeinen Grund dazu haben.

    function initbuttons() {
    var curbutton, wordxbuttons;

    wordxbuttons = [ {name: 'wordxbold', cmd: 'bold', img: 'bold', title: 'Fett'},
         {name: 'wordxitalic', cmd: 'italic', img: 'italic', title: 'Kursiv'}];

    Du machst hier etwas Gefährliches: Durch deine ungünstige Wahl der Bezeichner ist die Gefahr, name und id zu verwechseln, sehr groß. Peter Pan hast du schon erfolgreich hinters Licht geführt. ;-)

    for each (var xbutton in wordxbuttons) {
    curbutton = document.getElementById(xbutton.name);

    Zu welchem Zeitpunkt wird dieses Script ausgeführt? Während das Dokument noch geladen wird? Existiert das Element dann schon, auf das du zugreifen möchtest?

    curbutton.onclick = wordxcmd(xbutton.cmd);

    Das geht mit Sicherheit auch schief - oder gibt die Funktion wordxcmd(), die wohl anderswo definiert ist, eine Funktionsreferenz zurück?

    Dabei ist das absoluter Unsinn. "curbutton" ist im Dokument wie folgt ausgeschrieben: "<img src="" id="wordxbold" alt="">"

    Das zweite Element wordxitalic auch?

    Vielleicht weiß jemand von euch Rat? Wäre für jede Hilfe dankbar.

    Wir brauchen mehr Input. Am besten einen Link auf die Problemseite, damit man sich selbst ein Bild machen kann.

    So long,
     Martin

    --
    Datenbanken speichern keine User.
    Das liegt daran, daß Datenbanken mit der Lebensmittelversorgung für gespeicherte biologische Lebensformen derzeit noch Probleme haben.
      (Christoph Schnauß)
    1. Hi!

      Du machst hier etwas Gefährliches: Durch deine ungünstige Wahl der Bezeichner ist die Gefahr, name und id zu verwechseln, sehr groß. Peter Pan hast du schon erfolgreich hinters Licht geführt. ;-)

      Ja spotte ruhig;) Wer Quelltexte nur überfliegt und dann antwortet muß bestraft werden!

      off:PP

      --
      "You know that place between sleep and awake, the place where you can still remember dreaming?" (Tinkerbell)
  3. mach mal am anfang der schleife ein alert(xbutton.name); und ein alert(document.getElementById(xbutton.name)); rein.

    --
    for your security, this text has been encrypted by ROT13 twice.
  4. Die Javascript Konsole in Firefox sagt mir bei folgendem Script die ganze Zeit dass "curbutton" null ist:

    Ja.

    curbutton.onmousedown = function() { curbutton.src = ('images/wordx/active/' + xbutton.img + '.gif'); if (evt.preventDefault) evt.preventDefault() };

    Hier musst du auf this zugreifen, nicht auf curbutton. Und ich vermute auch, dass du hier nicht auf das richtige xbutton Objekt zugreifst. Da deine Schleife beim aufruf dieses Events schon längst beendet ist.

    Der beste Weg, um solche Problem zu lösen ist es eine Helperfunktion, die eine Funktion zurückliefert, für deinen Eventhandler.

    In etwa so:

    function getDownEvent(button) {  
       return function(evt) {  
          this.src = 'images/wordx/active/' + button.img + '.gif';  
          if (evt.preventDefault) evt.preventDefault();  
       }  
    }  
      
    curbutton.onmousedown = getDownEvent(xbutton);
    

    curbutton.onclick = wordxcmd(xbutton.cmd);

    Gibt diese Funktion eine Funktionsreferenz zurück? Ansonsten ist diese Zuweisung falsch.

    curbutton.onmouseover = function () { curbutton.src = ('images/wordx/hover/' + xbutton.img + '.gif') };
    }

    Hier auch this, statt curbutton

    Und noch zwei interessante Links für dich:
    http://redaktion.selfhtml.org/selfhtml-preview/javascript/einbindung.html#traditionelles-event-handling
    http://redaktion.selfhtml.org/selfhtml-preview/javascript/einbindung.html#fehler-handler-aufrufen

    Struppi.

  5. Die Javascript Konsole in Firefox sagt mir bei folgendem Script die ganze Zeit dass "curbutton" null ist:

    Wann sagt sie es? Bei Aufruf von initbuttons oder bei Testen der Eventhandler?

    for each (var xbutton in wordxbuttons) {

    for each wird nicht von jedem Browser unterstützt, beispielsweise Internet Explorer. Eine herkömmliche for-Schleife reicht völlig.

    curbutton = document.getElementById(xbutton.name);

    curbutton.unselectable = "on";
    curbutton.onmousedown = function() { curbutton.src = ('images/wordx/active/' + xbutton.img + '.gif'); if (evt.preventDefault) evt.preventDefault() };

    Du produzierst an genau dieser Stelle einen Closure, den du sicher nicht haben willst. curbutton verweist nicht auf das Element, dem du den onmousedown-Hanlder zuweist, sondern auf das Element, das im letzten Schleifendurchlauf gefunden wurde. Mit `xbutton`{:.language-javascript} hast du das gleiche Problem.  
      
    
    > Dabei ist das absoluter Unsinn. "curbutton" ist im Dokument wie folgt ausgeschrieben: "<img src="" id="wordxbold" alt="">"  
    > Vielleicht weiß jemand von euch Rat? Wäre für jede Hilfe dankbar.  
    
    Wann wird `initbuttons`{:.language-javascript} aufgerufen? Nach dem Laden des Dokuments?
    
    -- 
    Reden ist Silber, Schweigen ist Gold, meine Ausführungen sind Platin.  
      
    Self-Code: sh:( ch:? rl:( br:> n4:( ie:{ mo:) va:) de:> zu:} fl:| ss:| ls:~ js:|