T3afBon3: getElementByID unter IE 6?

Ich habe eine HTML-Seite, deren Design mittels mehrerer Tabellen aufgebaut wird. Der Inhalt der Seite sind Umfragen. Ich wollte jede Umfrage jeweils in einen eigenen <form>-Bereich stecken. Sieht dann ungefär so aus:

<form name="form_1" id="form_1" method="post" action="polls_save.php">
<span style="display: none" id="span_1" name="span_1">

//Umfrageinhalt Checkboxen oder Radio und ein Submitbutton

</span>
</form>

//nächste Umfrage

<form name="form_2" id="form_2" method="post" action="polls_save.php">
<span style="display: none" id="span_2" name="span_2">

//Umfrageinhalt: Checkboxen oder Radio und ein Submitbutton

</span>
</form>

Wie Ihr sehen könnt ist der <span>-Bereich mittels CSS am anfang unsichtbar. Jetzt steht über jeder Umfrage ein Link, der bei anklicken, den <span>-Bereich sichtbar machen soll:

<a class="vote" href="#" onClick="show_vote('span_1');return false;">Umfrage 1</a>^

Beim Anklicken wird folgende Javascript-Funktion aufgerufen:

function show_vote( id_span )
{
span = "span_"+id_span;
displayType = ( document.getElementById( span ).style.display == 'none' ) ? 'block' : 'none';
document.getElementById( span ).style.display = displayType;
}

Bei Netscape funktioniert es einwandfrei. Die Funktion spricht das Element "Span" ohne Probleme an und macht es sichtbar und unsichtbar. Auch ist es möglich den Button zum Versenden zu betätigen und die Werte mittels POST zu versenden.

Beim Internet Explorer 6 spricht er mir das Span-Element nicht an und sagt mir, dass er das Object nicht findet. Allerdings ist es im Quelltext definiert. Was jetzt sonderbar ist, wenn ich die <span>-Bereiche ohne den <form>-Bereich definiere und es dann ausführe funktioniert es. Das einzige was halt dann nicht geht, ist, dass ich die Werte nicht mittels POST verschicken kann, was aber unbedingt nötig ist.

<span style="display: none" id="span_1" name="span_1">

//Umfrageinhalt Checkboxen oder Radio und ein Submitbutton

</span>

//nächste Umfrage

<span style="display: none" id="span_2" name="span_2">

//Umfrageinhalt: Checkboxen oder Radio und ein Submitbutton

</span>

  1. Hallo,

    ohne es ausprobiert zu haben hier zwei Stellen, an denen Du Dein Glück versuchen könntest:

    1.) Versuch mal, die IDs ohne Unterstriche zu vergeben (also span1, nicht span_1). Ich meine mich zu erinnern, dass es mit den Unterstrichen Probleme geben kann, finde aber gerade keine Referenzstelle dafür, kann also auch ein Erinnerungsfehler von mir sein.

    2.) Du verhaspelst Dich evtl. mit inline/block-Elementen. Span ist im Defaultfall inline, ich bin mir fast sicher dass es nicht zulässig ist, Formularelemente innerhalb eines Span zu notieren --> Validator befragen. Außerdem legst Du dann per JavaScript display:block fest, wechselst damit für die Spans von inline zu block, was kein Fehler ist, aber schon mal Browser verwirrt (hatte mal ein ähnliches Problem, allerdings mt Mozilla). Mein Vorschlag: Ersetze die Spans durch Divs, dann hast Du die block/inline-Baustelle umschifft.

    Ich hoffe, eines von beiden hilft Dir.

    Grüße,

    Utz

    --
    Mitglied im Ring Deutscher Mäkler
    1. Hi,

      divs hatte ich als erstes auch, allerdings wollte ich keinen Leerraum zwischen den Umfragen lassen, z. B.

      <a ...>Umfrage 1</a>
      <a ...>Umfrage 2</a>

      mit den Divs hat er dann soviel platz freigehalten, die die divs brauche, wenn sie sichtbar sind:

      <a ...>Umfrage 1</a>

      <a ...>Umfrage 2</a>

      Mit der CSS-Angabe height:0px; kann man den Freiraum unterdrücken, allerdings müsste ich ja dann beim anzeigen des divs die Höhe angeben und die ist von Umfrage zu Umfrage unterschiedlich. Die Höhe kann ich bei den Methoden nicht mit übergeben, weil alles mittels PHP aus einer Datenbank gelesen wird.

      Dann habe ich das mit dem <span>-Element gesehen und mit dem funktionierte es prima, bis ich halt den <form>bereich definierte.

      1. Hallo,

        Mit der CSS-Angabe height:0px; kann man den Freiraum unterdrücken,

        Bahnhof?

        allerdings müsste ich ja dann beim anzeigen des divs die Höhe angeben und die ist von Umfrage zu Umfrage unterschiedlich.

        Und außerdem verm. unterschiedlich je nach eingestellter Schriftgröße.

        margin-bottom:0px; sollte die Abstände zwischen den Divs zuverlässig entfernen (wobei es Defaultmäßig eigentlich keine Leerzeilenabstände zwischen Divs gibt wie es das bei Ps der Fall ist, da hast Du verm. an anderer Stelle etwas für Div definiert, was Du jetzt über IDs oder eine class überschreiben müsstest).

        Grüße,

        Utz

        --
        Mitglied im Ring Deutscher Mäkler
        1. Es geht nicht um die Abstände zwischen den Divs...

          ...am besten schaust du es dir mal an.

          http://www.bang-lan-than.de/site/allgemeines/polls.php

          Dann siehst du was ich für ein Problem hab.
          Es gibt zwei Umfragen

          "Welches Game"

          "Welche Battlefield Version"

          ---------------------

          Ich habe den Code von <span> auf <div> umgestellt und die Unterstriche weggelassen. Auf jeden Fall findet er jetzt das Element wieder. Also danke für Deinen Tipp, anscheinend lag es an dem Unterstrich oder daran, dass das <span>-Element mit dem <form> oder <table>-Element nicht interpretiert werden konnte.

          1. Hat sich erledigt, ich hab den Fehler gefunden.

            Ich habe anstatt display, visibility verwendet, deshalb hat er mir
            zwischen den einzelnen Elementen einen Abstand freigelassen (Platzhalter)

            Also danke utz für deine Hilfe.

  2. Hi,

    <span style="display: none" id="span_1" name="span_1">
    <a class="vote" href="#" onClick="show_vote('span_1');return false;">Umfrage 1</a>^
    function show_vote( id_span )
    {
    span = "span_"+id_span;

    Die Variable span enthält jetzt "span_span_1".

    displayType = ( document.getElementById( span ).style.display == 'none' ) ? 'block' : 'none';

    Das läuft also auf
    displayType = ( document.getElementById( "span_span_1" ).style.display == 'none' ) ? 'block' : 'none';
    raus.
    Ein solches Element hast Du aber vermutlich nicht.

    Bei Netscape funktioniert es einwandfrei.

    Das wage ich - anhand des gegebenen Codes - zu bezweifeln.

    Ach ja, span hat kein name-Attribut.

    cu,
    Andreas

    --
    MudGuard? Siehe http://www.Mud-Guard.de/
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hi,

      das Name-Attribut habe ich jetzt einfach mal so mit ergänzt, im Quelltext habe ich es auch weggelassen.

      Der Methode show_vote die id des Span-Objekts übergeben, also zum beispiel "1" oder "2"...

      Ich wollte es hier nicht mit Variablen unnötig verkomplizieren, da ich ziemlich viel PHP-Code mit drinen hätte.

      Die Variable

      "span" enthält bei der Verwendung von der getElementById-Funktion dann "span_1" und nicht "span_span_1".

      sry, für so etwas wäre eine editierungsfunktion nicht schlecht, damit ich den Fehler beim Post ausbessern kann.

      1. Hi,

        Der Methode show_vote die id des Span-Objekts übergeben, also zum beispiel "1" oder "2"...

        Warum postest Du hier anderen Code als den tatsächlich verwendeten?

        Ich wollte es hier nicht mit Variablen unnötig verkomplizieren, da ich ziemlich viel PHP-Code mit drinen hätte.

        Beim Browser kommt kein PHP-Code an - wo ist also das Problem, den Code zu zeigen, der im Browser zur Anwendung kommt?
        Wofür gibt es denn View-Source im Browser?

        cu,
        Andreas

        --
        MudGuard? Siehe http://www.Mud-Guard.de/
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Ich hab den Code aus meinem Entwicklungstool rauskopiert und
          hab ihn dann hier so umgestellt, dass kein PHP mehr vorkommt, weil es für dieses Problem hier nebensächlich ist.

          Man einen Fehler kann doch jedem mal unterlaufen.

          1. hi,

            Man einen Fehler kann doch jedem mal unterlaufen.

            ja - allerdings sollte dir auch bewusst sein, dass gerade dein vorgehen zu _erhöhter_ fehleranfääligkeit führt.

            und wenn wir hier einen fehler im coding suchen, können wir nicht noch zusätzliche fehler brauchen, die beim herumwuschteln am (serverseitigen) code mit reinkommen.

            also in so einem fall in zukunft bitte _immer_ das posten, was _im browser_ als code ankommt und dort den fehler verursacht hat.

            gruß,
            wahsaga

            --
            [ Hier könnte Ihre Werbung stehen! ]
            1. Ist mir ja bewust, wird nicht mehr vorkommen.

      2. Hallo,

        sry, für so etwas wäre eine editierungsfunktion nicht schlecht, damit ich den Fehler beim Post ausbessern kann.

        das Einbauen einer Editierfunktion wurde bereits abgelehnt: http://bugs.selfhtml.org/bug.php?op=show&bugid=259 - wenn du was korrigieren willst, kannst du dir selbst antworten und ggf das Thema ändern (Vorschau verwenden).

        Grüße aus Nürnberg
        Tobias

        --
        Selfcode: sh:( fo:) ch:? rl:( br:< n4:& ie:% mo:| va:) de:] zu:) fl:( ss:| ls:[ js:|