✔ JavaScript, nach OnClick Wert an Inputfeld Übergeben.

Crazy_down · 20. September 2007

Hi, ich wollte es nicht direkt ins Java-Forum schreiben, ansonsten verschiebt es einfach

Also ich lasse mir mit einem JavaScript, 2 Zufallszahlen Generieren und möchte das sie dann als Value in einem Textfeld stehen.

Code:

<script type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren

    function Start(Minimum, Maximum)
{
         var zufallszahl1 =0;
         var zufallszahl2 =0;
    var zufallszahl1 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
            var zufallszahl2 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    alert(zufallszahl1);
            alert(zufallszahl2);
}
// -->
</script>
<input type="submit" onClick=Start(0,10)></input>
<input type="text" value=<?$zufallszahl1?>></input>

Nur wie bekomme ich die nach dem Ausführen da rein ? muss ich die Irgendwie Übergeben ?

Muss mich mal Entschuldigen, habe das Ajay und JavaScript Forum Übersehen

Danke schonmal
grüße
crazy_down

hans jörg · 20. September 2007

Abend,
als erstes brauchst du mal das Textfeld als Objekt im Javascript zur Verfügung und ann änderst du einfach seine value Eigenschaft. zB. so:

HTML:

<script type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren

    function Start(Minimum, Maximum)
{
         var zufallszahl1 =0;
         var zufallszahl2 =0;
    var zufallszahl1 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
            var zufallszahl2 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    document.getElementById("outputfield").value = "Zahl1: "+zufallszahl1+" - Zahl2: "+zufallszahl2;
}
// -->
</script>
<input type="submit" onClick=Start(0,10)></input>
<input id="outputfield" type="text" value=<?$zufallszahl1?>></input>

Crazy_down · 21. September 2007

uhm vielen Dank. Ich habe mir einige Tutorials besorgt und das stand Natürlich auch drinne, aber irgendwie habe ich das wohl Ignoriert

Crazy_down · 21. September 2007

Ich würde das gerne etwas erweitern ohne einen neuen Thread

Ich möchte eine ausgabe mchen so oft wie die Zufallszahl ist. Also dachte ich mit einer For schleife.

Code:

for (var i = 1; i <= zufallszahl1; i++)
    {
    document.write("ausgabe");
    }

Das funktioniert zwar auch soweit, aber das Formular kommt dann nicht mehr. Also er soll die Ausgabe direkt unter das Formular machen. Aber nicht in ein Input feld oder so, sondern halt direkt ausgeben. Wie mache ich das am besten ?
Also sozusagen eine Ausgabe auf der gleichen Seite erzeugen.

Danke schonmal

hans jörg · 21. September 2007

wenn ich dich richtig verstehe willst du immer wenn jemand den Button zum Generieren einer Zufallszahl drückt diese unter dem Formular anzeigen?
Dann würdest du unter dem Formular zb ein HTML Element brauchen von dem du den Inhalt austauschen kannst:

HTML:

<form></form>
<span id="outputfield" ></span>

(oder, der vollständigkeit wegen: du könntest dich etwas komplizierter über den DOM Baum an die richtige stelle hanteln und ein neues Element erstellen)
den Vode müsstest du dann zb so ändern:

HTML:

<script type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
    function Start(Minimum, Maximum)
{
         var zufallszahl1 =0;
         var zufallszahl2 =0;
    var zufallszahl1 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
            var zufallszahl2 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    document.getElementById("outputfield").innerHTML = "Zahl1: "+zufallszahl1+" - Zahl2: "+zufallszahl2;
}
// -->
</script>

Anmerkung: innerHTML funktioniert zwar in allen modernen Browsern ist aber nicht offizieller Bestandteil von DOM - wenn du darauf Wert legst müsstest du zb mit createElement und appendChild bzw replaceNode arbeiten

Crazy_down · 21. September 2007

Ehm fast, ich will eigentlich das wenn jemand auf Generieren drückt, das die Zuffalszahl wie es schon geschiet in dem Input-Feld steht und auf der seite darunter dann der Durchlauf bis dahin also bei einer "8" dann "0,1,2,3......,7" Die Zahlen will ich später durch Bilder ersetzen.

Versucht habe ich das jetzt so.

Code:

<html>
<head>
<title></title>
<script type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren

    function Start(Minimum, Maximum)
{
         zufallszahl1 =0;
         zufallszahl2 =0;
         ergebnis =0;
         zaehler=0;


    var zufallszahl1 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
            var zufallszahl2 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    //document.getElementById("zufallszahl_feld1").value = "Zahl1: "+zufallszahl1+" - Zahl2: "+zufallszahl2;
    document.getElementById("zufallszahl_feld1").value = zufallszahl1;
    document.getElementById("zufallszahl_feld2").value = zufallszahl2;
    ergebnis =zufallszahl1+zufallszahl2;
       //document.getElementById("ergebnis_ausgabe").value = ergebnis;

}
 function ausgabe()
   {
         roemer_zahl1=document.getElementById("zufallszahl_feld1").value;
          for(zaehler=0;zaehler<roemer_zahl1;zaehler++){
          document.write(zaehler);               }

   }

   function pruefen()
   {
         ergebnis_eingabe=document.getElementById("ergebnis_eingabe").value;
         if(ergebnis_eingabe==ergebnis)
         {
           alert("richtig");
         }
         else
         {
         alert("Falsch");
         Start(0,10);
         }
   }


// -->
</script>

</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">

<table border="1">
<tr><td>
Zahl 1:<input id="zufallszahl_feld1" READONLY=true type="text" value=<?$zufallszahl1?>></input>
</td>
<td>
Zahl 2:<input id="zufallszahl_feld2" READONLY=true type="text" value=<?$zufallszahl2?>></input>
</td></tr>
<tr><td></td><td>
<input type="submit"  onClick=Start(0,10) value="neue Zufallszahlen"></input>
</td>
</tr><tr><td>
Ergebnis: <input id="ergebnis_eingabe" type="text"></input> </td>

<!--richtiges ergebnis:<input id="ergebnis_ausgabe" type="text" readonly=true value=<?$ergebnis?>></input>-->
<td>
<input type="submit"  onClick=pruefen() value="Ergebnis Prüfen"></input></td></tr>
</table>

<SCRIPT LANGUAGE="JavaScript"><!--
          ausgabe();

 //--></SCRIPT>
</body>
</html>

Wenn man jetzt eine Zahl generiert und dann F5 drückt steht die reihenfolge darunter. das soll aber gleich beim klicken passieren. Nur jetzt Funktioniert die Ergebnis prüfung nicht mehr wenn ich F5 drücke. Nur davor

Ich hoffe ich konnte es einiger Maßen erklären.

hans jörg · 21. September 2007

Bin mir wieder nicht genau sicher ob ich dich verstanden habe

- aber eventuell hast du dir das so vorgestellt:

HTML:

<html>
<head>
<title></title>
<script type="text/javascript">
<!-- // JavaScript-Bereich für ältere Browser auskommentieren
var zufallszahl1 =0;
var zufallszahl2 =0;
var ergebnis =0;
function Start(Minimum, Maximum)
{
    zufallszahl1 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    zufallszahl2 = Math.floor(Minimum+(Maximum-Minimum+1)*(Math.random()));
    //document.getElementById("zufallszahl_feld1").value = "Zahl1: "+zufallszahl1+" - Zahl2: "+zufallszahl2;
    document.getElementById("zufallszahl_feld1").value = zufallszahl1;
    document.getElementById("zufallszahl_feld2").value = zufallszahl2;
    ergebnis =zufallszahl1+zufallszahl2;
    //document.getElementById("ergebnis_ausgabe").value = ergebnis;

}
function ausgabe()
{
	 var ob = document.getElementById('resultField');
	 ob.innerHTML = "";
	 for(var zaehler=0; zaehler<ergebnis; zaehler++)
	 {
	 	ob.innerHTML += zaehler;
	 }

}
function pruefen()
{
	 var ergebnis_eingabe=document.getElementById("ergebnis_eingabe").value;
	 if(ergebnis_eingabe == ergebnis)
	 {
	   alert("richtig");
	   ausgabe();
	 }
	 else
	 {
	 alert("Falsch");
	 Start(0,10);
	 }
}


// -->
</script>

</head>
<body text="#000000" bgcolor="#FFFFFF" link="#FF0000" alink="#FF0000" vlink="#FF0000">

<table border="1">
<tr><td>
Zahl 1:<input id="zufallszahl_feld1" READONLY=true type="text" value="<?$zufallszahl1?>"></input>
</td>
<td>
Zahl 2:<input id="zufallszahl_feld2" READONLY=true type="text" value="<?$zufallszahl2?>"></input>
</td></tr>
<tr><td></td><td>
<input type="submit"  onClick=Start(0,10) value="neue Zufallszahlen"></input>
</td>
</tr><tr><td>
Ergebnis: <input id="ergebnis_eingabe" type="text"></input> </td>

<!--richtiges ergebnis:<input id="ergebnis_ausgabe" type="text" readonly=true value=<?$ergebnis?>></input>-->
<td>
<input type="submit"  onClick=pruefen() value="Ergebnis Prüfen"></input></td></tr>
</table>
<div id="resultField"></div>
<SCRIPT LANGUAGE="JavaScript"><!--
          //ausgabe();

 //--></SCRIPT>
</body>
</html>

Crazy_down · 21. September 2007

Ehm ja genau

habe die ausgabe(); noch indie start Funktion gelegt.
Vielen dank. Ich versuche mal es mir selbst zu Erklären, wäre nett wenn du mir sagen könntest ob es so richtig ist.
Also du hast ein div genommen, was sozusagen angibt wo der Text ausgegeben werden soll ?

HTML:

var ob = document.getElementById('resultField');
     ob.innerHTML = "";

Damit sagst du das es im resultfield sein soll und mit ob.innerHTML; das es auf diesem HTMl Dokument sein soll oder ? Nur was ist mit dem ".ob" ?

Aber schonmal vielen Dank. ich hoffe ich komme jetzt damit etwas weiter

hans jörg · 21. September 2007

statt

HTML:

function ausgabe()
{
	 var ob = document.getElementById('resultField');
	 ob.innerHTML = "";
	 for(var zaehler=0; zaehler<ergebnis; zaehler++)
	 {
	 	ob.innerHTML += zaehler;
	 }

}

könntest du auch

HTML:

function ausgabe()
{
	 ob.innerHTML = "";
	 for(var zaehler=0; zaehler<ergebnis; zaehler++)
	 {
	 	document.getElementById('resultField').innerHTML += zaehler;
	 }

}

schreiben. In ob (= frei von mir gewähler variablen Name - meine Abkürzung für object) speichere ich mir einen verweis auf den div da ich ihn ja in der Schleife öfters benötige und den Browser nicht jedes mal sagen will (auch wenn ers sehr schnell macht

, dass er immer das Element mit der id resultField suchen soll

Crazy_down · 21. September 2007

Aha o.k. und du lässt ja jetzt mit

HTML:

    ob.innerHTML += zaehler;

den Zaehlerstand in die Variable schreiben. Wenn ich aber jetzt so oft wie der Zaehler ist ein bild ausgeben möchte, muss ich dann das Bild in ob.innerHTML laden ?

Und wie geschieht die ausgabe ? ich sehe kein document.write oder sonstiges ?
mit dem += macht man doch nur eine Zuweisung ?oder ?

Also ich wollte jetzt das ganze so probieren:

HTML:

var asterix = document.getElementById('asterix'); 
asterix.innerHTML="";
	 for(var zaehler=0; zaehler<zufallszahl1; zaehler++)
	 {
	 	ob.innerHTML += zaehler;
                 asterix.innerHTML +=zaehler;
	 }

<img src="asterix.jpg" alt="asterix" id="asterix">

und damit erreichen das er das Bild so oft anzeigt wie der zaehler durch läuft.

✔ JavaScript, nach OnClick Wert an Inputfeld Übergeben.

Crazy_down

Erfahrenes Mitglied

hans jörg

Erfahrenes Mitglied

Crazy_down

Erfahrenes Mitglied

Crazy_down

Erfahrenes Mitglied

hans jörg

Erfahrenes Mitglied

Crazy_down

Erfahrenes Mitglied

hans jörg

Erfahrenes Mitglied

Crazy_down

Erfahrenes Mitglied

hans jörg

Erfahrenes Mitglied

Crazy_down

Erfahrenes Mitglied

Neue Beiträge