Frage zur Javascript Funktion onclick



  • Hallo wie krieg ich es hin das die Variable points immer um 1 erhöht wird wenn ich auf das Bild klicke ?

    Das Problem bei mir ist das die Variable points auch hochgezählt wird wenn ich gar nichts anklicke.

    Wie setzt man onclick richtig ein ?

    //wenn ich hier das mit java scri.. language etc. schreibe
    // dann lässt mich das Forum mein Beitrag nicht absenden ~_~
    var inc = 0;
    var points = 0;
    var biggest_nr = 200;
    var smallest_nr = 1;
    
    function bewegen()
    {
    	if (inc < 50)
    	{
    			inc++;	
    
    			picture.style.left= Math.round(Math.random()*biggest_nr+smallest_nr);
    			picture.style.top= Math.round(Math.random()*biggest_nr+smallest_nr);
    			picture.style.right= Math.round(Math.random()*biggest_nr+smallest_nr);
    
    			window.setTimeout ('bewegen()', 100);
    
    			picture.onclick = count();
    
    	}
    
    	else
    	{
    		document.write ( "Punkte: ");
    		document.write ( points );
    	}
    
    }
    
    function count()
    {
    	points++;
    }
    
    </script>
    
    <body onLoad="bewegen()">
    
    <div id ="picture" style="position:absolute; left:0px; top:0px">
    <img src = "bild.bmp">
    </div>
    
    </body>
    


  • Einfach in das Imag-Tag onlick angeben.



  • Ty das zählen funktioniert schonmal.

    Aber wenn ich z.b. window.SetTimeout auf 500 habe auch 4 mal auf das Bild klicke dann wird mir nur am ende eine 2 ausgeben.

    Ist Java Script dafür vielleicht zu langsam die anderen Mausklicks zu verarbeiten ?

    <html>
    
    var inc = 0;
    var points = 0;
    var biggest_nr = 200;
    var smallest_nr = 1;
    var hwnd=0;
    
    function bewegen()
    {
    	if (inc < 4)
    	{
    			inc++;	
    
    			picture.style.left= Math.round(Math.random()*biggest_nr+smallest_nr);			
    			picture.style.top= Math.round(Math.random()*biggest_nr+smallest_nr);
    			picture.style.right= Math.round(Math.random()*biggest_nr+smallest_nr);
    
    			window.setTimeout ('bewegen()', 500);
    
    	}
    
    	else
    	{
    		document.write ( "Punkte: ");
    		document.write ( points );
    	}
    
    }
    
    function count()
    {
    	points++;
    }
    
    </script>
    
    <body onLoad="bewegen()">
    
    <div id ="picture" style="position:absolute; left:0px; top:0px">
    
    <img src = "bild.bmp" onClick =count()>
    </div>
    
    </body>
    </html>
    


  • Das ist alles etwas durcheinander. Ich weiß gar nicht, was du eigentlich machen willst.
    Bisher passiert folgendes:

    bewegen() wird aufgerufen, inc = 1
    ...
    bewegen() wird aufgerufen, inc = 4

    bewegen() wird aufgerufen, inc == 4, daher in den else-Zweig
    bewegen() wird nicht mehr aufgerufen (da kein Timeout mehr gesetzt wurde) und dein count() zählt fröhlich points hoch, ohne das du davon was mitbekommst.



  • Wahrscheinlich willst du sowas:

    var moveTimer = window.setInterval("bewegen()", 500);
    var pointsTimer = window.setInterval("showPoints()", 2000);
    function bewegen()
    {
                picture.style.left= Math.round(Math.random()*biggest_nr+smallest_nr);           
                picture.style.top= Math.round(Math.random()*biggest_nr+smallest_nr);
                picture.style.right= Math.round(Math.random()*biggest_nr+smallest_nr);
    }
    function showPoints()
    {
            document.write ( "Punkte: ");
            document.write ( points );
    }
    function count()
    {
        points++;
    }
    function stop()
    {
         window.clearInterval(moveTimer);
         window..clearInterval(pointsTimer);
    }
    ...
    <body>
    <div id ="picture" style="position:absolute; left:0px; top:0px">
    <img src = "bild.bmp" onClick = "javascript:count();">
    <button type="button" onclick="javascript:stop();">
    </div>
    
    </body>
    


  • Was ich genau machen will:

    Ich will das sich mein Bild im Browser hin und her springt und immer wenn man es schafft das Bild anzuklicken dann soll die Variable points um eins erhöht werden.

    Wenn die Variable inc einen bestimmten Wert erreicht hat dann sollen am Ende die Punkte ausgeben werden.


Anmelden zum Antworten