Eric S.: Zugriff auf Elternelement klappt nicht

Hi, folgender Code:

if ( scmac[j][i] != 0 ) { var bgcolor = eval("color_extra"+scmac[j][i]); }  
					document.write('<td style="background-color: ' + bgcolor + ';" class="body-input"><input class="input-std" style="background-color: ' + bgcolor + ';" onfocus="this.select()" ondblclick="this.nextSibling.style.display=\'block\'" onchange="scma['+j+']['+i+']=this.value;Summe('+j+')" onblur="this.nextSibling.style.display=\'none\'" value="'+ausgabe+'"><div class="ddmenu" style="display: none;"><ul>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_neutral+';" onclick="insert('+j+', '+i+', 0);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_neutral + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_neutral + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'				  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra1+';" onclick="insert('+j+', '+i+', 1);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra1 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra1 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra2+';" onclick="insert('+j+', '+i+', 2);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra2 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra2 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra3+';" onclick="insert('+j+', '+i+', 3);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra3 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra3 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra4+';" onclick="insert('+j+', '+i+', 4);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra4 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra4 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra5+';" onclick="insert('+j+', '+i+', 5);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra5 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra5 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra6+';" onclick="insert('+j+', '+i+', 6);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra6 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra6 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra7+';" onclick="insert('+j+', '+i+', 7);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra7 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra7 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra8+';" onclick="insert('+j+', '+i+', 8);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra8 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra8 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra9+';" onclick="insert('+j+', '+i+', 9);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra9 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra9 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
					+'</ul></div></td>');
var color_sonntag = "#fa8072";  
var color_neutral = "#ffffff";  
var color_zu = "#000000";  
var color_krank = "#4169e1";  
var color_urlaub = "#00ff00";  
var color_feiertag = "#afeeee";  
var color_extra0 = color_neutral;  
var color_extra1 = "#FFFF00";  
var color_extra2 = "#FF0033";  
var color_extra3 = "#9900CC";  
var color_extra4 = "#666666";  
var color_extra5 = "#3333FF";  
var color_extra6 = "#66FFFF";  
var color_extra7 = "#66FF66";  
var color_extra8 = "#00CC00";  
var color_extra9 = "#FF6633";  
var color_extra10 = "#afeeee";  
var color_extra11 = "#000000";  
var color_extra12 = "#fa8072";  
var color_extra13 = "#115577";  
var color_extra14 = "#884422";  
var bgcolor = color_neutral;

Ich möchte das 4. Elternelement (4 mal nach oben quasi) bzw das nächste Element von eben diesem ansprechen (welches ein input ist) doch es klappt irgendwie nicht :-( sieht jemand den Fehler? Das ganze läuft in einer Schleife, die in einer Schleife läuft =) Var scma != scmac (nur so am Rande ^^ ) Ich werde nicht schlau draus. Kurzum, ich möchte auf das erste TD und das erste INPUT zugreifen und die Farbe ändern (jeweils die selbe) indem ich auf einen der LIs klicke, aber es tut sich nichts, außer das die Liste wieder zu geht, was sie auch soll - das ganze muss im IE8 laufen :-/

  1. Hallo Eric,

    Hi, folgender Code:

    uff :(

    Ich rate mal:

    • du hast nicht beachtet, dass es immer auch ein tbody gibt.
    • du hast nicht beachtet, dass auch Leerzeichen oder Umbrüche zwischen den Tabellenelementen Knoten sind.

    Wenn ich falsch geraten haben sollte, poste mal einen vollständigen UND auf das wesentliche reduzierten Code, besser noch einen Link auf eine Testseite.

    Gruß, Jürgen

    1. @@JürgenB:

      nuqneH

      • du hast nicht beachtet, dass es immer auch ein tbody gibt.

      Fast immer.

      Qapla'

      --
      „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
    2. Also laut Debugger kommt:
      <td>
      → <input>
      → <div>
        → <ul>
          → <li>
            → <div> (mit onclick-funktion / Farbwwechsel)

      Der relevante Code ^^" hmm ok ich schau mal was relevant ist

    3. Der Code:

      function Plan() {  
      	for ( j = 0; j < scma.length; j++ ) {  
      		var forscma = scma[j];  
      		if ( opt_sichtbar[j] == "Yes" ) {  
      			var varj = j;  
      			document.write('<table border="0" style="border-collapse:collapse" class="body-dienstplan">');  
      			document.write('<tr><td class="body-geb b"><input class="input-geb" size="8" value="' + forscma[2] + '"></td><td class="body-tage">&nbsp;</td><td class="body-tage">01</td><td class="body-tage">02</td>/* ### Diverse Spalten, alle gleich / Code gekürzt ### */<td class="body-tage">29</td><td class="body-tage">30</td><td class="body-tage">31</td><td class="body-std b">Stunden</td></tr>');  
      			document.write('<tr><td class="body-name"><input class="input-name" size="15" value="' + forscma[0] + '"></td><td class="body-FS b">F</td>');  
      			var ausgabe = "";  
      			var tag = 0;  
      			for ( i = 3; i < forscma.length; i = i + 2 ) {  
      				var vari = i;  
      				ausgabe = forscma[i] + "\n";  
      				if ( ausgabe == 0 ) { ausgabe = "&nbsp;"; }  
      				tag++;  
      				var datum = new Date(jahr, monat, tag);  
      				var wochentag = datum.getDay();	  
      				/* Bewegliche Feiertage von 2014 bis 2024 */		  
      				if 	    ( tag == 18 && monat == 3 && jahr == 2014 ) { feiertag = "true" }  
      				/*....  
      				#### Hier stehen diverse Feiertage / Code gekürzt ###  
      				....*/  
      				else    { feiertag = "false" }  
      				/* Backgroundcolor für Feiertage, Sonntage, Wochentage */			  
      				if 		( wochentag == 0 && feiertag == "false" ) { var bgcolor = color_sonntag;	}  
      				else if ( wochentag == 0 && feiertag == "true" ) { var bgcolor = color_feiertag; }  
      				else if ( wochentag != 0 && feiertag == "true" ) { var bgcolor = color_feiertag; }  
      				else if ( wochentag == 0 && feiertag == "zu" ) { var bgcolor = color_zu; }  
      				else if ( wochentag != 0 && feiertag == "zu" ) { var bgcolor = color_zu; }  
      				else 	{ var bgcolor = color_neutral; }  
      				if ( scmac[j][i] != 0 ) { var bgcolor = eval("color_extra"+scmac[j][i]); }  
      					document.write('<td style="background-color: ' + bgcolor + ';" class="body-input"><input class="input-std" style="background-color: ' + bgcolor + ';" onfocus="this.select()" ondblclick="this.nextSibling.style.display=\'block\'" onchange="scma['+j+']['+i+']=this.value;Summe('+j+')" onblur="this.nextSibling.style.display=\'none\'" value="'+ausgabe+'"><div class="ddmenu" style="display: none;"><ul>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_neutral+';" onclick="insert('+j+', '+i+', 0);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_neutral + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_neutral + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'				  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra1+';" onclick="insert('+j+', '+i+', 1);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra1 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra1 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra2+';" onclick="insert('+j+', '+i+', 2);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra2 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra2 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra3+';" onclick="insert('+j+', '+i+', 3);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra3 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra3 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra4+';" onclick="insert('+j+', '+i+', 4);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra4 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra4 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra5+';" onclick="insert('+j+', '+i+', 5);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra5 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra5 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra6+';" onclick="insert('+j+', '+i+', 6);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra6 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra6 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra7+';" onclick="insert('+j+', '+i+', 7);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra7 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra7 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra8+';" onclick="insert('+j+', '+i+', 8);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra8 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra8 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'<li class="ddsubmenu"><div class="ddbox" style="background-color:'+color_extra9+';" onclick="insert('+j+', '+i+', 9);this.parentNode.parentNode.parentNode.parentNode.style.backgroundColor=\'' + color_extra9 + '\'; this.parentNode.parentNode.parentNode.parentNode.childNodes[0].style.backgroundColor=\'' + color_extra9 + '\';this.parentNode.parentNode.parentNode.style.display=\'none\';">&nbsp;</div></li>'  
      					+'</ul></div></td>');  
      			}  
      			  
      /* ### Hier steht eine 2. Schleife, die praktisch Identisch ist mit der obigen ### */  
        
      			var sum = 0;  
      			for ( i = 4; i < forscma.length; i++ ) {  
      			sum += forscma[i];  
      			}  
      			document.write('<td id="summe'+j+'" class="body-anzahl">'+sum+'</td></tr></table>');			  
      		}  
      		else {  
      			document.write('<div class="leer">&nbsp;</div>');  
      		}  
      	}  
      }
      

      var scma und var scmac sind jeweils 2 Dimensionale Arrays, die angesprochenen Variablen stimmen alle - Seltsamerweise hat es gestern funktioniert, warum jetzt nicht weiss ich nicht, vllt hab ich versehentlich irgendwas geändert was garnicht sein sollte ^^""" nur finde ich den Fehler einfach nicht

      1. Hallo Eric,

        Der Code:

        immer noch uff :(

        ... nur finde ich den Fehler einfach nicht

        durch das document.write-Zeugs blicke ich auch nicht durch. Am besten wäre ein Link zu deiner Testseite, dann kann man sich das erzeugte HTML im Browser (Auswahlquelltext oder Firebug) ansehen.

        Gruß, Jürgen

  2. Meine Herren!

    Ich möchte das 4. Elternelement (4 mal nach oben quasi) bzw das nächste Element von eben diesem ansprechen (welches ein input ist) doch es klappt irgendwie nicht :-

    "klappt irgendwie nicht" klappt irgendwie nicht als Fehlerbeschreibung.

    Welches verhalten erwartest du, welches Verhalten beobachtest du stattdessen?
    Gibt es Fehlermeldungen?
    Hast du dir die Elemente beim traversieren mal der Reihe nach im Debugger eingeschaut?
    Am besten du stellst ein Online-Beispiel zur Verfügung, dein Code ist nämlich nur sehr schwer zu entziffern: Keine Kommentare, keine aussagekräftigen Bezeichner, seltsame Konstrukte mit eval()...