Select onchange a la Firefox Suchbox

louS

Mitglied
Hi,
kann man per Javascript ein Background image eines anderen Elements ändern? http://justlous.de/temp/ffsearch.jpg

Bei Google hab ich leider nichts gefunden, zwar vieles mit onchange aber nicht das was ich suche.

Also,
vielen dank schon mal :)


##EDIT##

Ich habs nun halbwegs

HTML:
<script>
<!--
function ChangeId(TheID)
{
    document.getElementById(\'search\').id = TheID;
    return true;
}
//-->
</script>

HTML:
<li id="search" class="navigation_right">
<form action="index.php" method="get">

<input type="text" size="53" class="search_textline" name="suche" />

<input type="text" size="53" class="search_textline" value="Suchbegriff..." name="suche" />

<select name="in" onChange="ChangeId(this.options[this.selectedIndex].value);" class="sectionselect">
    <option value="search">Alle Bereiche</option>
    <option value="search_news">News</option>
    <option value="search_pictures">Fotos</option>
</select>

<input type="submit" value=""  class="search_button"/>
</form>
</li>

Dadurch wird einfach die ID des listenelements getauscht und in der stylesheet sind dann die ID's definiert.

Nur es gibt einen Fehler, ob man dies so nennen kann? Und zwar wird die ID zwar onchange geändert, allerdings nur einmal. Wenn man also nach der Auswahl wieder was auswählt, dann wird nichts mehr geändert.

Evtl. kann man da einer weiterhelfen :)
 
Moin Lou,

Code:
document.getElementById(\'search\').id = TheID;

logisch wird da nichts mehr gefunden...da du die ID geändert hast, wird beim nächsten Versuch das Element nicht mehr gefunden, es hat ja nicht mehr die ID "search", anhand der du darauf zugreifen willst.

Du könntest stattdessen das Hintergrundbild über einen Klassennamen erzeugen, und den Klassennamen ändern:

Code:
document.getElementById(\'search\').className="andereKlasse";

Du kannst natürlich auch das Hinergrundbild selbst ändern per JS:
Code:
document.getElementById(\'search\').style.backgroundImage="url(pfad/zum/anderen/bild.gif)";
 
hmm das ist das selbe in grün, habs mit der klasse versucht, er ändert die in die klasse wie ich sie unter js angegeben hat, hier zb. "Klasse"

document.getElementById(\'search\').className="Klasse";
 
Das ist sicher nicht dasselbe in grün, da du das Element nicht anhand seines Klassennamens mit JS ansprichst, sondern über die ID:
Code:
document.getElementById(\'search\')
 
Ich dachte, du willst Hilfe bei deinem Problem.
Wenn du alles selber so gut weisst, dann werde ich dich mit meiner Hilfe nicht weiter belästigen ;)
 
Oh tut mir leid das du mich falsch verstanden hast, aber hmm ich versuchs nochmal :)

Also das ein Element durch getElementById genommen wird, da hast du ja recht, aber nun klappt das nicht mit dem "klassenwechseln" sofern man eine option unter select wählt.

Also ich kann eigentlich kaum js, da kannst du nur recht haben was du sagst :)

Ich bin auf deine Hilfe gerade angewiesen

**EDIT**
Ich weiß nicht woran es scheiterte, aber es geht nun :D Nochmals vielen vielen dank Sven
 
Zuletzt bearbeitet:

Neue Beiträge

Zurück