fuchs: i++ Schleife

Hallo liebe Foren benutzer,

ich habe da ein Problem, und zwar will ich, wenn man auf ein Link klickt, dieser den Wert einer Textbox um 1 erhöht.

Mein Vorschlag bzw. mein Code ist folgender, denn ich aus diesen Forum heute von einen anderen Forenbenutzer "kopiert" habe nur passt der mir nicht so ganz:

  
function pluss()  
{  
  for (i=1;i<=10;i++)  
  {  
     document.getElementbyId("txtbox").innerHTML = "i++"  
  }  
}  

  
<input type="button" id="txtbox" onclick="pluss" />  

Wenn ich jetzt auf den Button klicke kommt gleich die 10. Ist ja klar, weil die for-schleife nicht abgebrochen werden kann.

Wie kann ich es dennoch schaffen, immer bei einem klick eins zu erhöhen, bzw. mit welcher Schleife?

Weißt denn die Schleife auch, bei welchem Wert sie ist?

Viele Grüße
fuchs

  1. Hallo,

    Weißt denn die Schleife auch, bei welchem Wert sie ist?

    den wert der textbox musst du vorher ermitteln:
    var wert = documen.getElementById("DeineTextbox").value;

    weil du damit rechnen willst, musst du ihne rechen-fähig machen:
    wert = parseFloat(wert);

    anschliessend erhöhst du den wert und teilst ihn der box zu:
    documen.getElementById("DeineTextbox").value = wert++;

    ==> nix mit schleife ^^

    MfG. Christoph Ludwig

    --
    Wo die Sprache aufhört, fängt die Musik an...
    Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
    Go to this
    1. Hallo nochmal,

      erstmal vielen Dank für eure ganzen postings. Das war schon sehr hilfreich.

      Ich bin jetzt noch auf etwas schwieriges gestoßen:

      In meiner Textbox steht folgendes: Datei1.pdf , was ich vorhin meinte sollte ja so sein, dass wenn ich auf den Button klicke immer plus 1 dazu addiert wird, also Datei2.pdf und so weiter.

        
      function plus()  
      {  
       var s;  
       s = parseInt(s);  
       var f = document.getElementById("TextBox").value = "Datei"+f+".pdf";  
       f = parseInt(f);  
       s = f + 1;  
       document.getElementById("TextBox").value = "Datei"+s+".pdf";  
      }  
      
      
        
      <input type="text" id="TextBox" name="TextBox" value="Datei1.pdf"/>  
      <input type="button" onclick="plus()"/>  
      
      

      Was mache ich falsch? In der TextBox erscheint dann "DateiNAN.pdf"

      Viele Grüße
      fuchs

      1. Yerf!

        In meiner Textbox steht folgendes: Datei1.pdf , was ich vorhin meinte sollte ja so sein, dass wenn ich auf den Button klicke immer plus 1 dazu addiert wird, also Datei2.pdf und so weiter.

        Das macht das ganze etwas schwieriger, aber nicht unlösbar.

        function plus()
        {
        var s;

        Hm, eine variable s mit nicht deiniertem Wert

        s = parseInt(s);

        Der wird nach Integer gewandelt

        var f = document.getElementById("TextBox").value = "Datei"+f+".pdf";

        Hier wird von rechts nach links gearbeitet, d.h. due weist dem Value deines Inputs einen text zu und diesen dann der variablen f.

        f = parseInt(f);

        Das wird nicht funktionieren, da es kein reiner zahlenwert ist.

        s = f + 1;

        somit kann man auch nicht Addieren

        document.getElementById("TextBox").value = "Datei"+s+".pdf";

        Dies erzeugt dann die bekannte Ausgabe, da NAN die Ausgabe für "keine zahl" ist.

        }

        
        > ~~~html
          
        
        > <input type="text" id="TextBox" name="TextBox" value="Datei1.pdf"/>  
        > <input type="button" onclick="plus()"/>  
        > 
        
        

        Was mache ich falsch? In der TextBox erscheint dann "DateiNAN.pdf"

        Einiges... die ersten 2 zeilen können erst mal entfallen, da du s später sowieso mit dem Ergebnis der Addition überschreibst.

        Spannend wirds in der 3. Zeile, da musst du aus dem Strin die Zahl extrahieren, pasreInt kann das in der Form nicht alleine. Wenn der Aufbau immer gleich ist kann man dazu z.B. http://de.selfhtml.org/javascript/objekte/string.htm#substr@title=substr() verwenden, also:

        var f = document.getElementById("TextBox").value.substr(5,1);

        Sollte der Aufbau schwanken (anzahl der Ziffern z.B.) musst du evtl. die Position des Punktes noch ermitteln, die Übersicht über die String-Methoden sollte da weiterhelfen.

        Gruß,

        Harlequin

        --
        <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
        1. Hallo liebve Forennutzer,

          Tausend Tausend Tausend Dank. Klappt wunderbar.

          Viele Grüße
          fuchs

          1. Hallo liebe Forennutzer,

            hab ein Problem wieder, wobei ich sagen muss, dass es eine Erweiterung von mein Problem von vorgester ist. Nochmal Tausend Dank für Eure Hilfen:

            Mein Code:

              
            function plus()  
            {  
             var f = document.getElementById("TextBox").value.substr(5,10);  
             f = parseInt(f);  
             s = f + 1;  
             var a = document.getElementById("TextBox");  
             a.value = "Datei"+s+".pdf";  
              
                    if(a.value = "Datei5.pdf")  
                    {  
                    document.getElementById("bzwei").style.display=="none";  
                    document.getElementById("bzwei").visibility =="hidden";  
                    }  
              
            }  
              
            function minus()  
            {  
             var f = document.getElementById("TextBox").value.substr(5,10);  
             f = parseInt(f);  
             s = f - 1;  
             var a = document.getElementById("TextBox");  
             a.value = "Datei"+s+".pdf";  
            }  
              
            
            
              
            Der HTML Code:  
            <input type="button" id="beins" value="minus" onclick="minus();"/>  
            <input type="button" id="TextBox" value="Datei1.pdf" readonly/>  
            <input type="button" id="bzwei" value="plus" onclick="plus();"/>  
            
            

            Also, wenn die Datei5.pdf in der Textbox erscheint soll der Button "bzwei" verschwinden bzw. die funktion deaktiviert werden, so dass beim draufklicken nichts bzw. etwas transparent wird.

            Viele Grüße und nochmal Tausend Tausend Dank.
            fuchs

            1. hab ein Problem wieder,

              Die Antwort war zwar schon in dem anderen Thread, aber na gut.

              if(a.value = "Datei5.pdf")

              Kann es sein, dass du hier einen Vergleich machen möchtest und keine Zuweisung? Dann fehlt ein Gleichheitszeichen.

              {
                      document.getElementById("bzwei").style.display=="none";
                      document.getElementById("bzwei").visibility =="hidden";

              Das wäre doppelt gemoppelt, wenn die zweite Anweisung richtig geschrieben wäre und sie irgendetwas bewirken würde.

              Struppi.

  2. Hallo,

    <input type="text" name="textfield" id="textfield" value="0" />

      
    function inc(f) {  
    f.value = (parseInt(f.value)+1).toString();  
    }  
    
    

    mfg, Flo

    --
    Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
    sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
    *Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...
    1. Hallo,

      <input type="text" name="textfield" id="textfield" value="0" />

      function inc(f) {
      f.value = (parseInt(f.value)+1).toString();
      }

        
      was soll er damit anfangen?  
      wie definierst du "f"?  
        
        
      MfG. Christoph Ludwig
      
      -- 
      Wo die Sprache aufhört, fängt die Musik an...  
      Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)  
        
      Go to [this](http://home.arcor.de/minicrispie/index.html) 
      
    2. Hallo,

      <input type="text" name="textfield" id="textfield" value="0" />  
      <input type="button" onclick="inc(textfield);" />
      
        
      var textfield = document.getElementById('textfield');  
      function inc(f) {  
      f.value = (parseInt(f.value)+1).toString();  
      }  
      
      

      Sorry...

      mfg, Flo

      --
      Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
      sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
      *Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...
      1. Hallo,

        Hallo,

        <input type="text" name="textfield" id="textfield" value="0" />

        <input type="button" onclick="inc(textfield);" />

        
        >   
        > ~~~javascript
          
        
        > var textfield = document.getElementById('textfield');  
        > function inc(f) {  
        > f.value = (parseInt(f.value)+1).toString();  
        > }  
        > 
        
        

        trotzdem nicht richtig...

        <input type="text" name="textfield" id="textfield" value="0" />  
        <input type="button" onclick="inc(textfield);" />
        
          
        var f = document.getElementById('textfield');  
        function inc(f) {  
        f.value = (parseInt(f.value)+1).toString();  
        }  
        
        

        wenn, dann so ;)

        MfG. Christoph Ludwig

        --
        Wo die Sprache aufhört, fängt die Musik an...
        Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
        Go to this
        1. Hallo,

          Warum?

          mfg, Flo

          --
          Developers are dying. Computers are getting trash. CEO's become forgetten. The only remaining things are ideas, lies and crises. So if you want to be immortal, first think, than stop it and go to microsoft and become later a manager at Lehman Brothers...
          sh:) fo:| ch:? rl:( br:^ n4:| ie:{ mo:| va:} de:> zu:} fl:{ ss:) ls:< js:|
          *Zu dem de:> Ich benutze wegen IE im moment noch tabellen, weil dieser display:table noch nicht versteht. Ich werde aber, wenn IE 6 & IE 7 < 10% mein neues CSS-Layout einspielen...
          1. Hallo,

            Warum?

            weil du auf meinem ersten blick "f" nicht definiert hast ...
            und auf dem zweiten blick dann doch ... sry^^

            MfG. Christoph Ludwig

            --
            Wo die Sprache aufhört, fängt die Musik an...
            Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
            Go to this
        2. trotzdem nicht richtig...

          <input type="text" name="textfield" id="textfield" value="0" />

          <input type="button" onclick="inc(textfield);" />

          
          >   
          > ~~~javascript
            
          
          > var f = document.getElementById('textfield');  
          > function inc(f) {  
          > f.value = (parseInt(f.value)+1).toString();  
          > }  
          > 
          
          

          wenn, dann so ;)

          Nee. Vor dem Posten: Nachdenken nicht vergessen! ;)

          Eine globale Variable zu setzen, deren Namen der ID gleicht, macht wenig Sinn. Muss man ohnehin beim onload tun, da das Element vorher, also beim Ausführen des Scripts, nicht zur Verfügung steht.

          Entweder ihr streicht den Parameter und nehmt das var f in die Funktion, dann ist sie nicht mehr flexibel. Oder ihr übergibt der Funktion das Element: inc(document.getElementById('textfield')). Wahlweise die ID als String, dann schreibt ihr getElementById auch in die Funktion: function inc (id) { var feld = document.getElementById(id); ...

          Mathias

          1. Hallo,

            naja das hatte ich ja in meinem ersten posting auch geschrieben ... nur das meine funktion(noch zusammensetzen!) nicht flexibel war

            MfG. Christoph Ludwig

            --
            Wo die Sprache aufhört, fängt die Musik an...
            Selfcode:  ie:( fl:| br:^ va:| ls:/ fo:| rl:? n4:) ss:) de:] js:) ch:{ sh:) mo:) zu:)
            Go to this
    3. f.value = (parseInt(f.value)+1).toString();

      toString wird in dem Kontext, in dem ein String erwartet wird, übrigens automatisch aufgerufen und muss nicht unbedingt händisch aufgerufen werden.
      parseInt ist aber tatsächlich nötig und ratsam.

      Mathias

    4. [latex]Mae  govannen![/latex]

      Hallo,

      <input type="text" name="textfield" id="textfield" value="0" />

      [code lang=javascript]
      function inc(f) {
      f.value = (parseInt(f.value)+1).toString();

      Bei parseInt immer als zweiten Parameter den Radix-Wert (hier : Dezimalsystem, also 10) angeben, da sonst bei Eingabe von 03 unvorhergesehene Werte erzeugt werden können (obwohl das Dezimalsystem bei vielen Browsern inzwischen als Vorgabe genommen wird)

      Wenn man ganz sicher sein kann, daß wirklich nur Zahlen im Textfeld stehen, reicht sogar ein f.value = (+f.value) + 1;

      toString() braucht man nicht, Textfelder sind immer String, wird automatisch gewandelt.

      Cü,

      Kai

      --
      Ash nazg durbatulûk, ash nazg gimbatul,ash nazg thrakatulûk, agh burzum-ishi krimpatul
      selfcode sh:( fo:| ch:? rl:( br:< n4:# ie:{ mo:| va:) js:) de:> zu:) fl:( ss:| ls:?
      Mein Selfhtml-Kram
  3. Da keiner auf dein Problem eingeht.

    Wenn ich jetzt auf den Button klicke kommt gleich die 10. Ist ja klar, weil die for-schleife nicht abgebrochen werden kann.

    richtig erkannt.

    Wie kann ich es dennoch schaffen, immer bei einem klick eins zu erhöhen, bzw. mit welcher Schleife?

    Du kannst hier gar keine Schleife verwenden, sondern musst mit timeouts arbeiten. Das liegt an der Besonderheit in den Browsern, dass diese in einem JS nicht automatisch die Anzeige aktualisieren, du musst also die Skritpausführung unterbrechen um eine Aktualiserung zu erzwingen.

    Wie so ein Ablauf aussehen kann, kannst du z.b. in diesem Artikel sehen.

    Struppi.