onclick li Farbe ändern

[lahau]

Hallo,

ein DICKES DICKES DANKESCHÖN!
Klappt super alles geht reibungslos!

Em wegen den Div's mit den id's darf nicht nur ein Element eine ID besitzen weil man ja sonst klassen benutzen soll?


DANKE!

 

[CPoly]

Ich meinte damit so was

<div id="menu_wrapper">
     <ul id="menu1" class="menu">
          <li><a href="">Menu1.1</a></li>
          <li><a href="">Menu1.2</a></li>
     </ul>
      <ul id="menu2" class="menu">
          <li><a href="">Menu2.1</a></li>
          <li><a href="">Menu2.2</a></li>
          <li><a href="">Menu2.3</a></li>
          <li><a href="">Menu2.4</a></li>
     </ul>
</div>

Jetzt könntest du in dem ursprünglichen Code einfach "menu_wrapper" benutzen und er würde alle LI Elemente finden.

 

[lahau]

Achso,

ja das geht halt in meine fall nicht weil ich die menus an unterschiedlichen stellen haben...
Du meintest ja das getElementsByClassName nicht jeder browser zuläst z.b. IE9 -.- Firefox klapt es ohne probleme das ist jetzt natürlich Sch.....ade.

Naja man könnte doch auch mit einem UND-Befehl udn noch einer schleife zwei Ul id's in einem Array zusammenpacken?
Das müsste doch gehen oder?

Ich glaube da setze ich mich heute mal dran und bastel deinen script um... wenn ich erste ergebnise habe stell ich diese mal rein und es wäre nett wenn du dann mal drüber schauen könntest, glaube ich werde eh ein paar fehler machen

 

[CPoly]

Also eigentlich müsstest du dafür nicht viel ändern. Da wo du im Moment

var lists = document.getElementsByClassName('list');

stehen hast, musst du eben anstelle von getElementsByClassName irgendwie anderes die beiden Listen in das Array bekommen. Das kannst du ja mal versuchen (geht auch in einer Zeile!).

 

[lahau]

Ok,
jetzt bin ich wieder ahnungslos^^
ich hätte gedacht das man einfach

for(var i=0; i<lists.length; i++) {
    //Alle Elemente der aktuellen Liste
    var tmpItems = lists[i].getElementsByTagName('li');
 
    //Elemente zum Array hinzufügen
    for(var k=0; k<tmpItems.length; k++) {
        items.push(tmpItems[k]);
    }
}

diesen teil für die zweite id mit rein nimmt.

wenn es auch in einer zeile zu lösen ginge hätte ich jetzt vermutet

var lists = document.getElementById('list'&&'list2');
// ODER
var lists = document.getElementById('list','list2');

aber beides klapt nicht.

hängt man einfach wie ich es versuchen wollte zwei id's aneinander oder kommt ein anderes get ElementBy irgentwas da hin?
Ein kleiner script von dir wäre noch mal nett.

Danke

 

[lahau]

...getElementById liefert genau ein Element (oder null)...".

Sehe gerade damit hätte ich mir meine versuche auch sparen können

d.h. das getElementByID muss sich ändern ^^

Hilfe wäre nett

 

[CPoly]

Ausgehend von dem Funktionierenden Code mit getElementsByClassName, musst du folgende Zeile

var lists = document.getElementsByClassName('list');//Die ListeEN

nur dadurch ersetzen

var lists = [document.getElementById('menu1'), document.getElementById('menu2')];

und schon hast du ein Array mit beiden Listen.

 

[lahau]

Ok

Danke meine ideen waren ja schon mal garnicht soo schlecht nur das man nicht einfach mit && oder , die zwei id's aneinander hängt sondern zwei mal document.getElementById schreibt.

jo ich werde es wieder mal testen und eine rückmeldung geben!

Vielen Dank

 

[lahau]

Jo,

noch ein letztes mal danke klappt alles reibungslos, und jetzt macht auch IE9 keine faxen meher


SUPER DANKE

 

[lahau]

Hallo,

da ist auch schon meine nächste frage....
Ich möchte einfach nur schauen, das wie vielte Array Element angeklickt wurde und dann anhand der Array Position entscheiden welchen style das vorherig angeklicket element wirder haben soll.

var active = null; 
var j = 0;                                 // J wird Deklariert und mit 0 Initialisiert
for (var i = 0; i < items.length; i++)      
{ 
    items[i].onclick = function ()  festlegen   
    {
        if (active != null)      
        {
            if(j < 5)                 // Hier wird geschaut wiegroß b j kleiner 5 ist
            {
                active.style.backgroundColor = '#E7E7E7'; //#323CFF
            }
            else
            {
                active.style.backgroundColor = '#323CFF'; //#323CFF
            }
            
            //active.style.color = '#323CFF'; //#323CFF
        }
        this.style.backgroundColor = '#323CFF'   
        this.style.color = 'white' 
        active = this;    
        j = i;                        // Das momantanige i wird auf j gespeichert damit beim nächen mal geprüft werden kann ob es if oder elses ist    
    };
}

ich nehmen mal an das ich da ein denk fehler drin haben...
weil diese 3 zeilen script sind ja fast in jeder sprache gleich
Hilfe wäre nett
Danke