Testo che cambi al click

webmachine

Utente Attivo
12 Gen 2016
43
0
6
Ciaoa tutti ragazzi, vorrei creare uno script che mi permetta, al click di un div, di cambiare il testo nel paragrafo sotto vorrei però inserire una sorta di array di frasi/parole che vengano mostrate ordinatamente ad ogni click vi faccio un esempio:
1° click:
Ciao, messaggio 1
2° Click (Scompare il messaggio precedente e compare...)
Ciao, messaggio 2
3° Click (Scompare il messaggio precedente e compare...)
Ciao, messaggio 3
etc.. etc.. etc..

Ora uso questo codice qui:
Codice:
   <div onclick="myFunction()"style="background-color:red;width:300px;height:300px;"></div>

 <p id="demo"></p>
 <script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Hello World";
}

</script>
come posso incrementarlo per farlo funzionare nel modo che voglio io?

Grazie Mille ;)
 

marino51

Utente Attivo
28 Feb 2013
3.203
207
63
Lombardia
questo è l'esempio più semplice (testato con IE),
HTML:
<div onclick="myFunction()" style="cursor:pointer; background-color:red; width:300px; height:300px;"></div>

<p id="demo"></p>

<script>

var counter=0;
document.getElementById("demo").innerHTML = "Hello World";

function myFunction() {
    counter++;
    switch(counter) {
        case 1:
            document.getElementById("demo").innerHTML = "Ciao, messaggio 1";
            break;
        case 2:
            document.getElementById("demo").innerHTML = "Ciao, messaggio 2";
            break;
        case 3:
            document.getElementById("demo").innerHTML = "Ciao, messaggio 3";
            break;
        default:
            document.getElementById("demo").innerHTML = "Hello World";
            counter=0;
    }
}

</script>

in alternativa, puoi creare un' array in cui inserire i testi, sostituendo la gestione "switch" con la gestione dell' array
 
Discussioni simili
Autore Titolo Forum Risposte Data
S Testo scrolla su immagine che cambia HTML e CSS 0
A testo responsivo che si ridimensiona in un div HTML e CSS 3
C testo che si ingrandisce assieme allo schermo HTML e CSS 3
G Testo che si adatta in grandezza alle misure di un DIV: è possibile farlo? HTML e CSS 2
A word 2007: INSERIRE TESTO CHE VENGA RIPETUTO NEL DOCUMENTO Windows e Software 1
P [RISOLTO] Testo che viene giù dall'alto HTML e CSS 3
L Animazione: testo 'che si scrive da solo', carattere per carattere Snippet Javascript 0
L Teoricamente che differenze ci sono tra BackgroundImage IMG e/o Testo normale?? HTML e CSS 2
A video e testo che interagiscono Javascript 0
S Campo di testo che non funziona !???!?!!? MySQL 79
emanuelevt testo che si adatta al div HTML e CSS 1
S Come creare un campo di testo e un pulsante che linka ad una pagina? CMS (Content Management System) 3
S Consiglio sito web per lettura di un file di testo che si aggiorna ogni secondo Javascript 9
V Bottone opzione che abilita casella di testo Javascript 0
J frontpage: testo che lampeggia HTML e CSS 1
F testo che lampeggia di continuo con DW HTML e CSS 3
I salvare testo chat PHP 4
E Creare un testo trasparente dietro un div HTML e CSS 5
S da casella di testo a campo tabella Database 0
A Ottenere sfumatura su testo Photoshop 8
M Mostrare testo (o parte di esso) in base a utente PHP 0
F Animazione testo sito web diminuire grandezza di un testo allo scroll Javascript 0
D Rendere testo cliccabile PHP 3
D Casella di testo con grassetto ecc... HTML e CSS 2
Couting95 inserire dati da un file di testo in una tabella in php PHP 1
D Aiuto CSS in ELEMENTOR - Cambiare un testo CMS (Content Management System) 0
V Mailchimp - box di testo: cambia da solo il testo inserito Email Marketing 2
Barierta Testo a comparsa con passaggio del mouse Javascript 17
G grandezza testo HTML e CSS 4
D Testo colorato in base a giorno settimana PHP 12
S impostare un testo e una img nella stessa riga con jsPDF Javascript 0
R Nome input testo+variabile PHP 1
A Errore visualizzazione selezione testo Photoshop 0
Alex_70 Cerca testo all'interno di una stringa PHP 5
A Estrapolare parti di testo con PHP PHP 2
G Testo in mysql format 3 MySQL 0
G Box con testo casuale WordPress 1
G Modifica testo Photoshop 3
Y Colore sfondo testo Javascript 0
seranto [ASP] Controllare il testo inserito in Textarea Classic ASP 6
S [HTML] Effetto su testo da togliere HTML e CSS 0
A [WordPress] Recuperare testo articoli da sito danneggiato WordPress 1
A [HTML] Testo mail non visualizzabile su IOS HTML e CSS 0
R Bootstrap 4 - creare una finestra di testo responsive sopra un Carousel jQuery 1
Gabriele15497514 php testo errato durante la lettura del file txt quando lo script viene eseguito contemporaneamente PHP 3
I Creare Qsl radioamatore con testo editabile Presentati al Forum 1
Cosina [PHP] Cancellare una riga da un file di testo in base al nome PHP 2
Shyson [MySQL] Sostituire testo in in articolo MySQL 0
kikdirty Testo e perfezioni il tuo sito dando il massimo del punteggio seo Offerte e Richieste di Lavoro e/o Collaborazione 0
D [Visual Basic] [MS Access] query con parametro di testo Visual Basic 4

Discussioni simili