Julian von Mendel: Manchmal gehts und manchmal nicht

Hi,

ich hab 20 divs. Alle haben eine ID zwischen "suche_0" und "suche_19". Am Anfang soll nur eines sichtbar sein, mit einem + und - Knopf sollen sich weitere ein- und ausblenden lassen.

Jetzt habe ich ein Javascript, mit den beiden Funktionen del und add:
--
function add()
{
if (anzahl==20)
{
  alert("Mehr als 20 Suchregeln können nicht erstellt werden.");
  return(FALSE);
}

anzahl++;
document.getElementById("suche_"+anzahl).style.display = "block";
}

function del()
{
var i;

if (anzahl==0)
{
  return(FALSE);
}

anzahl--;
document.getElementById("suche_"+anzahl).style.display = "none";
}
--
Eine dritte Funktion blendet mir 1 bis 19 aus, und setzt anzahl=1; anzahl ist global (der Zähler funktioniert auch einwandfrei); diese Funktion funktioniert ähnlich wie del() (nur immer einwandfrei im Gegensatz zu del... *g*).

Grundsätzlich funktionieren die beiden Knöpfe. Sowohl Firefox als auch Opera machen aber reproduzierbar Fehler, bzw. mein Code hat irgendwo einen Bug:
Drücke ich dreimal Plus, und zweimal Minus stimmt noch alles => 2 divs. Drücke ich ein weiteres Mal Minus, geht das div 1 (= das zweite) nicht mehr weg. Er setzt den Zähler jedoch trotzdem um eins herab. D. h. wenn ich dann nochmal drücke, verschwindet div 0.

Wo liegt der Fehler?

Schöne Grüße
Julian

--
"Real programmers can write assembly code in any language." - Larry Wall
  1. Hi,

    ich hab 20 divs.

    hossa. Bist Du sicher, dass Deine Struktur günstig gewählt ist?

    return(FALSE);

    Wo hast Du FALSE deklariert?

    document.getElementById("suche_"+anzahl).style.display = "block";

    Ohne Prüfung auf Objekt- und Methodenexistenzen?

    Drücke ich dreimal Plus, und zweimal Minus stimmt noch alles => 2 divs. Drücke ich ein weiteres Mal Minus, geht das div 1 (= das zweite) nicht mehr weg. Er setzt den Zähler jedoch trotzdem um eins herab. D. h. wenn ich dann nochmal drücke, verschwindet div 0.

    Was hat Deine Analyse ergeben?

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hallo,

      ich hab 20 divs.

      hossa. Bist Du sicher, dass Deine Struktur günstig gewählt ist?

      nein, bin ich nicht. Aber ich bin mir nicht sicher, ob es um genau die gewünschte Aufgabenstellung zu erfüllen, eine wesentlich bessere Möglichkeit gibt.

      return(FALSE);

      Wo hast Du FALSE deklariert?

      Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt. Nachdem ich bis jetzt sowieso an keiner Stelle den Rückgabewert abfrage, wird das nicht besonders entscheiden sein. Soll ich in Zukunft statt TRUE und FALSE einfach 1 und 0 verwenden?

      document.getElementById("suche_"+anzahl).style.display = "block";

      Ohne Prüfung auf Objekt- und Methodenexistenzen?

      Was genau muss ich da prüfen? Das die divs alle existieren, weiß ich sicher.

      Drücke ich dreimal Plus, und zweimal Minus stimmt noch alles => 2 divs. Drücke ich ein weiteres Mal Minus, geht das div 1 (= das zweite) nicht mehr weg. Er setzt den Zähler jedoch trotzdem um eins herab. D. h. wenn ich dann nochmal drücke, verschwindet div 0.

      Was hat Deine Analyse ergeben?

      Ich verstehe die Frage nicht wirklich. Eben weil ich mit dem Problem nicht weiter komme habe ich versucht möglichst genau meine Vorgehensweise zu beschreiben, und zu erklären, was nicht funktioniert. Da die Funktionen aber manchmal tun was sie sollen und manchmal nicht fehlt mir ein Anhaltspunkt. Da sowohl Firefox als auch Opera die gleichen Ergebnisse liefern, gehe ich aber davon aus, dass der Fehler bei meinem Code liegt. Meine Javascript-Erfahrung ist gering, und ich sehe keinen Fehler. Die für einen Fehler in Frage kommenden Zeilen sind äußerst wenig, deswegen dachte ich, dass jemand mit mehr Erfahrung in Javascript vielleicht auf den ersten Blick den verursachenden Fehler erkennt.

      Schöne Grüße
      Julian

      --
      "Real programmers can write assembly code in any language." - Larry Wall
      1. Hi,

        hossa. Bist Du sicher, dass Deine Struktur günstig gewählt ist?
        nein, bin ich nicht. Aber ich bin mir nicht sicher, ob es um genau die gewünschte Aufgabenstellung zu erfüllen, eine wesentlich bessere Möglichkeit gibt.

        wenn Du uns etwas mehr über Dein Projekt erzählst, könne wir Dir dabei vielleicht helfen. Auf den ersten Blick fiele mir ein <ol> o.ä. ein.

        Wo hast Du FALSE deklariert?
        Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt.

        Nun, das merkst Du spätestens daran, dass es in einem Browser nicht funktionierst. Womit entwickelst Du denn, dass das Script nicht abgebrochen wurde?

        Soll ich in Zukunft statt TRUE und FALSE einfach 1 und 0 verwenden?

        Nein, true und false.

        document.getElementById("suche_"+anzahl).style.display = "block";
        Ohne Prüfung auf Objekt- und Methodenexistenzen?
        Was genau muss ich da prüfen?

        a) Ob die Methode document.getElementById bekannt ist, und b) ob ihre Verwendung ein Ergebnis liefert.

        Das die divs alle existieren, weiß ich sicher.

        Du weiß sicher, dass 20 <div>s existieren. Weißt Du aber auch, ob dasjenige Element existiert, welches Du da abfragst? Nein, denn Du kannst es nicht wissen, weil Du nicht einmal weißt, welches es überhaupt ist. Du weißt nur, wie die Abfrage generiert wird.

        Was hat Deine Analyse ergeben?
        Ich verstehe die Frage nicht wirklich. Eben weil ich mit dem Problem nicht weiter komme habe ich versucht möglichst genau meine Vorgehensweise zu beschreiben, und zu erklären, was nicht funktioniert.

        Ja, Deine Beschreibung ist auch gut. Es fehlt aber Deine Analyse, was Dein Code _wirklich_ macht und welche Daten ihm _wirklich_ zur Verfügung stehen, also beginnend bei Debug-Ausgaben.

        Die für einen Fehler in Frage kommenden Zeilen sind äußerst wenig, deswegen dachte ich, dass jemand mit mehr Erfahrung in Javascript vielleicht auf den ersten Blick den verursachenden Fehler erkennt.

        Das ist selten der Fall; eigentlich nur, wenn sich ein echter Fehler wie z.B. "FALSE" geradezu aufdrängt. Um einem Problem auf den Grund zu kommen, braucht man aber in aller Regel eine Analyse - die aus viel gezieltem Ausprobieren besteht.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Hallo,

          vielen Dank ihr beiden! Der Fehler lag in der add()-Funktion. Ich hab erst den Zähler erhöht, und dann das entsprechende Objekt sichtbar gemacht. Da der Zähler aber bei 1 gestartet hat, war er dann auf 2, das 2. Objekt hat aber die ID suche_1. Dadurch wurde suche_1 ausgelassen, und es gab seltsame Effekte. D. h. ein simples Tauschen der Reihenfolge dieser zwei Befehle in add() und es geht.

          Das mit dem return habe ich geändert.

          hossa. Bist Du sicher, dass Deine Struktur günstig gewählt ist?
          nein, bin ich nicht. Aber ich bin mir nicht sicher, ob es um genau die gewünschte Aufgabenstellung zu erfüllen, eine wesentlich bessere Möglichkeit gibt.

          wenn Du uns etwas mehr über Dein Projekt erzählst, könne wir Dir dabei vielleicht helfen. Auf den ersten Blick fiele mir ein <ol> o.ä. ein.

          Ich möchte eine Suchfunktion, mit bis zu 20 Suchregeln. Jede Regel soll aus drei Objekten bestehen:
          * einer Select-box, um das zu durchsuchende Feld anzugeben (z. B. "Name", "Datum", etc.)
          * einer Select-box, um zwischen "ist, "enthält", "ist nicht" und "enthält nicht" auszuwählen
          * einem Textfeld
          Anfangs soll jedoch nur eine Regel angezeigt werden, weitere sollen sich mit Plus und Minus ein- oder ausblenden lassen. Die drei Objekte habe ich deshalb mittels eines divs gruppiert. Das Ganze in eine Liste zu packen ist sicher sauberer.

          Wo hast Du FALSE deklariert?
          Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt.

          Nun, das merkst Du spätestens daran, dass es in einem Browser nicht funktionierst. Womit entwickelst Du denn, dass das Script nicht abgebrochen wurde?

          Opera 8.0 Beta 3, Linux. Es hat eine Fehlermeldung in der Javascriptkonsole ausgegeben.

          document.getElementById("suche_"+anzahl).style.display = "block";
          Ohne Prüfung auf Objekt- und Methodenexistenzen?
          Was genau muss ich da prüfen?

          a) Ob die Methode document.getElementById bekannt ist, und b) ob ihre Verwendung ein Ergebnis liefert.

          b) ist sicher sinnvoll, a) in einem Intranet, wo die verwendeten Browser klar sind, eher nicht, oder liege ich da falsch?

          Das die divs alle existieren, weiß ich sicher.

          Du weiß sicher, dass 20 <div>s existieren. Weißt Du aber auch, ob dasjenige Element existiert, welches Du da abfragst? Nein, denn Du kannst es nicht wissen, weil Du nicht einmal weißt, welches es überhaupt ist. Du weißt nur, wie die Abfrage generiert wird.

          Wenn ich weiß, dass der Zähler immer zwischen 0 und 19 liegt, und die IDs auch alle da sind, dann passt doch alles?!

          Schöne Grüße
          Julian

          --
          "Real programmers can write assembly code in any language." - Larry Wall
          1. Ups, jetzt hab ich noch was vergessen:
            Der XHTML-Validator meldet mir das Attribut onClick und target für's form-Tag als Fehler. Warum?

            --
            "Real programmers can write assembly code in any language." - Larry Wall
              1. Hallo,

                http://de.selfhtml.org/html/xhtml/unterschiede.htm#kleinschreibung

                danke, da war ich blöd...

                http://de.selfhtml.org/html/frames/verweise.htm
                http://de.selfhtml.org/html/referenz/varianten.htm#strict_nicht_erlaubt

                Warum gelten Frames denn als deprecated? Ich kenne die Nachteile natürlich. Ich weiß auch, dass ich meine Seiten ohne Frames problemlos in mehrere Bereiche einteilen kann. Aber an sich ist das Konzept, einzelne Teile einer Seite neuladen zu können doch sehr praktisch. Sparrt Bandbreite und Zeit.

                Schöne Grüße
                Julian

                --
                "Real programmers can write assembly code in any language." - Larry Wall
                1. Hallo,

                  http://de.selfhtml.org/html/referenz/varianten.htm#strict_nicht_erlaubt

                  Warum gelten Frames denn als deprecated?

                  Frames gelten nicht als »deprecated«, sie stehen außerhalb dieser Kategorie. Jedoch das target-Attribut in regulären Dokumenten, die nicht Framesets sind, ist deprecated, weil es die Präsentationslogik betrifft. »Öffne Link im Frame XY« ist eine grundlegend andere Information als z.B. »die Sprache des Linkziels ist Französisch«. Dazu wirst du viele Diskussionen im Archiv finden, vor allem im Hinblick auf target="_blank".

                  Mathias

      2. Hallo Julian,

        Wo hast Du FALSE deklariert?

        Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt.

        Das gibts schon, aber return moechte keine Klammern. Also return false oder return true

        Ohne Prüfung auf Objekt- und Methodenexistenzen?

        Was genau muss ich da prüfen? Das die divs alle existieren, weiß ich sicher.

        Ob der Browser sowas ueberhaupt kann. Also sowas wie
        if (document.getElement)
        (
          dein code
        }
        else
        {
          mach sonstwas, zB. return false;
        }

        Was hat Deine Analyse ergeben?

        Pack mal in Deine Funktion alert(i) oder lass Dir die ID des betroffenen Elements ausgeben. Noch besser als alert() finde ich  window.status = i, dann musst du das alert nicht immer wegklicken

        Gruß,

        Dieter

        1. Hi,

          Wo hast Du FALSE deklariert?
          Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt.
          Das gibts schon,

          nein, gibt's nicht.

          aber return moechte keine Klammern.

          Das ist wahr.

          Also return false oder return true

          Es war nicht von false die Rede, sondern von FALSE.

          Cheatah

          --
          X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
          X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
          X-Will-Answer-Email: No
          X-Please-Search-Archive-First: Absolutely Yes
          1. Hallo Cheatah,

            tja, wieder was gelernt, ich wusste nicht dass Booleans in JS casesensitiv sind.

            Gruß,

            Dieter

            1. Hi,

              tja, wieder was gelernt, ich wusste nicht dass Booleans in JS casesensitiv sind.

              _JavaScript_ ist case-sensitive, nicht Teile davon.

              Cheatah

              --
              X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
              X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
              X-Will-Answer-Email: No
              X-Please-Search-Archive-First: Absolutely Yes
        2. Hallo Dieter,

          Nirgens. Ich wusste nicht, dass es das nicht standardmäßig in Javascript gibt.
          Das gibts schon, aber return moechte keine Klammern.

          Nein, so wie du es formuliert hast, ist das falsch.
          Richtig ist: Der Rückgabewert bei return _muss nicht_ in Klammern stehen. Es ist aber jedem freigestellt, beliebige Ausdrücke -auch wenn es nicht erforderlich ist- zusätzlich zu klammern. Auch wenn der Ausdruck hinter dem Keyword "return" steht.
          Das ist keinesfalls eine Fehlerursache.

          Im Gegenteil: Ich unterstütze sogar vehement, den Rückgabewert beim return-Statement immer in Klammern zu schreiben, weil sich dann die Systematik mit den meisten anderen Keywords (if, for, while, ...) besser und einheitlicher darstellt.

          Schönes WE,

          Martin