Javascript domanda per javascript

Minicreeper · 26 Agosto 2014

Salve sto facendo un sito, in questo sito devo mettere delle immagini che quando le clicchi cambiano e aggiunge +1 a una label, fino a qui ho fatto tutto, ma ho un problema:
quando clicco l'immagine dovrebbe aggiungere +1 e basta, ma invece se clicco più volte aumenta sempre...
so qual'è il problema ma non so come risolverlo, lo script è questo:

Codice:

function s1(){
 {document.rana1.src="Immagini/rana2.jpg";}; {document.getElementById('label').innerHTML = parseFloat(document.getElementById('label').innerHTML)+1;document.getElementById("label").disabled=true;}
 setTimeout(function(){document.rana1.src="Immagini/rana1.jpg"; },10000);

dovrei disabilitare l'opzione finchè l'immagine non torna normale... (penso di aver spiegato male, chiedete chiarimenti $:\$ )

SyncroIT · 27 Agosto 2014

Minicreeper ha detto:
Salve sto facendo un sito, in questo sito devo mettere delle immagini che quando le clicchi cambiano e aggiunge +1 a una label, fino a qui ho fatto tutto, ma ho un problema:
quando clicco l'immagine dovrebbe aggiungere +1 e basta, ma invece se clicco più volte aumenta sempre...
so qual'è il problema ma non so come risolverlo, lo script è questo:

Codice:

function s1(){ {document.rana1.src="Immagini/rana2.jpg";}; {document.getElementById('label').innerHTML = parseFloat(document.getElementById('label').innerHTML)+1;document.getElementById("label").disabled=true;} setTimeout(function(){document.rana1.src="Immagini/rana1.jpg"; },10000);

dovrei disabilitare l'opzione finchè l'immagine non torna normale... (penso di aver spiegato male, chiedete chiarimenti $:\$ )

Usa PHP dentro al Javascript per controllare se l'utente ha già votato l'immagine, oppure usi Ajax ma se non sai usarlo è meglio andare sul classico PHP + JS.

Inviato dal mio R800i con Tapatalk 2

Minicreeper · 27 Agosto 2014

Syncro ha detto:
Usa PHP dentro al Javascript per controllare se l'utente ha già votato l'immagine, oppure usi Ajax ma se non sai usarlo è meglio andare sul classico PHP + JS.

Inviato dal mio R800i con Tapatalk 2

e in che modo? D: comunque non è uno script per votare, sono dei punti quando clicchi sull'immagine e cambia immagine, e dopo 10 secondi torna come prima e l'utente può ricliccare per avere un'altro +1 nel punteggio...

tonyweb · 27 Agosto 2014

Ciao,
immagino che "s1" sia la funzione che viene richiamata quando clicchi sull'elemento con id 'label'.

Che tipo di tag usi per l'elemento con id 'label'? Se si tratta di un button (i.e. <input type="button" id="label" onclick="s1();" value="CLIC" />), impostarlo a disabled ha senso e funziona, ma se si tratta di un anchor (i.e. <a id="label" href="javascript:void(0)" onclick="s1();" >CLIC</a>) impostare disabled per esso non ha l'effetto di disabilitare l'evento.

Un modo per "risolvere" la questione è tenere traccia del click avvenuto, ad esempio così:

Codice:

<html>
    <head>
        <script>
            function s1()
            {
                if ( window.alreadyClicked ) return;
                // document.getElementById('label').disabled = true;
                window.alreadyClicked = true;
                
                alert('cliccato');
                
                setTimeout( 
                    function()
                    {
                        window.alreadyClicked = false;
                    }, 3000
                );
                
            }
        </script>
    </head>
    <body>
        <!-- <input type="button" id="label" onclick="s1();" value="CLIC" /> -->
        <a id="label" href="javascript:void(0)" onclick="s1();" >CLIC</a>
    </body>
</html>

Spero di esserti stato utile.

Ciao,
Tony

Minicreeper · 27 Agosto 2014

tonyweb ha detto:
Ciao,
immagino che "s1" sia la funzione che viene richiamata quando clicchi sull'elemento con id 'label'.

Che tipo di tag usi per l'elemento con id 'label'? Se si tratta di un button (i.e. <input type="button" id="label" onclick="s1();" value="CLIC" />), impostarlo a disabled ha senso e funziona, ma se si tratta di un anchor (i.e. <a id="label" href="javascript:void(0)" onclick="s1();" >CLIC</a>) impostare disabled per esso non ha l'effetto di disabilitare l'evento.

Un modo per "risolvere" la questione è tenere traccia del click avvenuto, ad esempio così:

Codice:

<html> <head> <script> function s1() { if ( window.alreadyClicked ) return; // document.getElementById('label').disabled = true; window.alreadyClicked = true; alert('cliccato'); setTimeout( function() { window.alreadyClicked = false; }, 3000 ); } </script> </head> <body>  <a id="label" href="javascript:void(0)" onclick="s1();" >CLIC</a> </body> </html>

Spero di esserti stato utile.

Ciao,
Tony

allora la cosa dovrebbe funzionare così: clicco sull'immagine, si modifica l'immagine e dopo 10 secondi torna normale (fino a qua funziona)
la funzione poi aumenta di 1 il punteggio nella label(fino a qua ugualmente va) però il problema è che non dovrebbe aumentare di 1 quando l'immagine cambia da immagine 1 a immagine 2, e poi ricliccare quando è immagine 1 per avere un'altro punto (non so se hai capito)

tonyweb · 27 Agosto 2014

@Minicreeper
Il frammento che ti ho postato "risolve" proprio il tuo "problema".

L'idea è che ti segni quando sei passato da immagine1 -> immagine2 in una variable (nel mio caso l'ho chiamata "alreadyClicked" ) e non fai nulla se hai già cliccato. Esegui nuovamente il comportamento solo quando il timeout è scaduto.

Per quanto ne so hai tutti gli elementi per "comporre" il codice che ti occorre, ma se proprio non ti è chiaro ...

Codice:

<html>
    <head>
        <script>
            function s1()
            {
                if ( window.alreadyClicked ) return;
                
                window.alreadyClicked = true;
    
                document.rana1.src="Immagini/rana2.jpg";
                document.getElementById('label').innerHTML = parseFloat(document.getElementById('label').innerHTML)+1
                
                setTimeout( 
                    function()
                    {
                        document.rana1.src="Immagini/rana1.jpg";
                        window.alreadyClicked = false;
                    }, 10000
                );
                
            }
            
            
        </script>
    </head>
    <body>
        <img name="rana1" src="Immagini/rana1.jpg" onclick="s1();" alt="Cliccami" />
        
        <div>
            <span>Punti totali:</span>
            <span id="label">0</span>
        </div>
    </body>
</html>

... ora spero che tu abbia compreso il concetto.

Saluti,
Tony

P.S. La prossima volta posta una pagina di test completa in modo che si possa comprendere il tuo "problema"

Cerca

Javascript domanda per javascript

Minicreeper

SyncroIT

Minicreeper

tonyweb

Minicreeper

tonyweb

DISCUSSIONI SIMILI