Sebastian Becker: select: per document.write geschriebenes Auswahlfeld wird nicht angezeigt

Hallo,

ich habe ein kleines Problem mit einem select-Menü, das aus einer externen js.-Datei ausgelesen wird: Das erste per document.write geschriebene Auswahlfeld wird nicht angezeigt, so daß ich immer ein zusätzliches leeres Dummy-Feld schreiben muß, das dann eben nicht angezeigt wird.

Ich will aber lieber korrekten Code schreiben, als mir mit solchen Tricks zu helfen. Nur, wo liegt der Fehler?

Danke für die Hilfe,

Sebastian

Nur für den Fall, daß die Problemstellung nicht ganz klar ist und/oder sich jemand näher damit beschäftigen möchte, hier das (abgekürzte) Script:

-------- schnipp ---------

// Array mit Menüinhalten aus Datenbank
var items = new Array
(
new item('Layout','layout.htm'),
new item('Layout Content','layout_content.htm'),
new item('Thema 1 Afro Beauty Shop','afrobeautyshop.htm'),
new item('Thema 2 Agrarbank von Griechenland','agrarbank.htm'),
new item('Thema 3 Almina  Mode & Antiquitäten','almina.htm'),
);

function item(theme,adress)
{this.theme=theme;this.adress=adress;}

// Linkaufruf bzw. Alertmeldungen bei falscher Auswahl
function go(adress)
{
if(adress == "headline")
{
alert("Themengruppen können nicht ausgewählt werden." + "\n\nBitte wählen Sie ein Thema.\n");
document.selector.reset();
document.selector.link.blur();
return false;
}
else if(adress == "empty")
{
alert("Bitte wählen Sie ein Thema.");
document.selector.reset();
document.selector.link.blur();
return false;
}
else
{
document.location.href = adress;
document.selector.reset();
document.selector.link.blur();
}
}

function writemenu()
{
document.write('<form name="selector">');
document.write('<select size="1" name="link" onChange="go(this.form.link.options[this.form.link.options.selectedIndex].value)"');

// Menüzeile schreiben
document.write('<option value="empty">'); // Wird komischerweise nicht angezeigt (?!)
document.write('<option value="headline" selected>Schnellnavigation');
document.write('<option value="empty">');
document.write('<option value="shopping.htm">Shopping');
document.write('<option value="kultur.htm">Kultur und Unterhaltung');
document.write('<option value="gastro.htm">Gastronomie, Hotels');
document.write('<option value="dienstleister.htm">Dienstleister');
document.write('<option value="Institutionen.htm">Institutionen');

for (var i=0; i<items.length; i++)
{

// Menütext begrenzen für Netscape < 6
var theme_abbrev;  // abgekürzter Menütext
if(items[i].theme.length > 30)
{theme_abbrev = (items[i].theme.substring(0, 28) + " ...")}
else {theme_abbrev = items[i].theme};

// Variable für zu schreibende Menüzeile
var y='<option value="'+items[i].adress+'">'+theme_abbrev;

// Menüzeile mit Werten aus Array schreiben
{document.write(y);}

}
document.write('</select>');
document.write('</form>');
}

  1. hi,

    Ich will aber lieber korrekten Code schreiben, als mir mit solchen Tricks zu helfen. Nur, wo liegt der Fehler?

    Dein Code scheint jetzt schon "korrekt" zu sein bloß offenbar nicht ganz vollständig. Und ich nehme an, daß du deinen "Fehler" mit Netscape angezeigt bekommst, ich habs eben mal mit dem IE5.5 durchprobiert, da klappt alles.
    Netscape ist bekanntlich wesentlich pingeliger als der IE. Versuch mal, sämtliche tags auch gewissenhaft zu schließen, also:

    document.write('<option value="gastro.htm">Gastronomie, Hotels</option>');

    Vielleicht wars das dann schon, denn im IE konnte ich deinen Fehler nicht reproduzieren.

    Christoph S.

    1. Hallo,

      danke für die freundliche Begutachtung.

      Hast Du beim Testen auch die von mir eingeführte Leerzeile gelöscht bzw. auskommentiert? So wie ich den Code gepostet habe funktioniert er nämlich auch bei mir, sowohl im IE 5.5 als auch im Netscape 4.73.

      Im Hinblick z.B. auf XML-Kompatibilität sollte man die option-Tags sicherlich schließen, das stimmt. Im Quellcode vieler - auch großer kommerzieller - Websites habe ich allerdings festgestellt, daß die Tags nicht geschlossen waren, wobei die Dropdownmenus trotzdem auch ohne Leerzeile korrekt funktionierten.

      Ich befürchte daher, daß der beschriebene Effekt
      etwas mit document.write zu tun hat.

      Grüße,

      Sebastian B.

  2. Hallo Sebastian,

    document.write('<select size="1" name="link" onChange="go(this.form.link.options[this.form.link.options.selectedIndex].value)"');

    Der <select>-Tag muss geschlossen werden, dir fehlt also ein > am Ende.

    mfg,
    Johannes