Test o un Quiz di valutazione.
×
Accedi al tuo account

Hai perso la password?
Registrati adesso è GRATUITO

Appena entrato avrai:
Norton Safe Web Connessione HTTPS Sicura

Registrati Adesso!

Menu
NAV
Pubblicità

BETA
Tag: Test, Quiz, valutazione.,
Valutazione discussione:
  • 0 voto(i) - 0 media
  • 1
  • 2
  • 3
  • 4
  • 5

Tutorial Test o un Quiz di valutazione.

375 Visite
Tecnico e Gestore
*******
5,056.50C
03/2013
118
1,022
Gestori
Messaggio: #1
Information  Tutorial Test o un Quiz di valutazione.
05/03/2017, 19:46

Aggiorna il tuo account per nascondere gli annunci pubblicitari.

[Immagine: yQUTYWn.png]


Demo:

[Immagine: 6LkTzoR.png]

Descrizione:

Capita di aver bisogno di un test o di un semplice quiz, magari per poter ricevere il permesso di accedere alla pagina successiva.

Non fidatevi però troppo, chiunque avesse un minimo di esperienza con JavaScript potrà andare a leggere il nome della pagina a cui accedere, e questo semplicemente consultando il listato che contiene il test.

Questo script è molto insolito ed è per questo che merita di essere pubblicato, non fosse altro per lo scopo didattico che racchiude in se.

Qui viene fornito con 3 domande e 4 possibili risposte per ognuna di esse, non sarà un problema aggiungere altre domande o aumentare il numero delle possibili risposte... una volta capito il meccanismo sarà sufficiente aggiungere nuove righe di codice sulla falsa riga di quelle esistenti.


Script:

Selezionare tutto il codice cliccando sulla forbice, quindi posizionandovi sul testo evidenziato adoperate il tasto destro del mouse per l'operazione di copia ed incolla, non rimane che trasferire il tutto nella vostra pagina web, in questo caso fra i tags: <head> e </head>.

Codice:
<script language="JavaScript" type="text/javascript">
<!--
// Prelevato su http://www.web-link.it

var ans = new Array;
var done = new Array;
var score = 0;

ans[1] = "a";
ans[2] = "b";
ans[3] = "c";
ans[4] = "d";
ans[5] = "a";
ans[6] = "b";
ans[7] = "c";
ans[8] = "d";
ans[9] = "a";
ans[10] = "b";

function Engine(question, answer) {

    if (answer != ans[question]) {
        if (!done[question]) {
            done[question] = -1;
            alert("Sbagliato!\n\nIl tuo punteggio è: " + score);
                }
        else {
            alert("Hai gia risposto a questa domanda!");
            }
        }
    else {
        if (!done[question]) {
            done[question] = -1;
            score++;
            alert("Esatto!\n\nIl tuo punteggio è: " + score);
                }
        else {        
            alert("Hai gia risposto a questa domanda!");
            }
        }
}
        
function NextLevel () {
    if (score > 9) {
        alert("Perfetto, praticamente non hai sbagliato nulla!");
        }
    if (score >= 7 && score <= 10) {
        alert("Accesso accordato!")
        self.location="nome_della_tua_pagina_di_accesso.htm"
        }
    else {
        alert("Accesso negato!  Ci vogliono almeno 7 risposte esatte per accedere alla prossima pagina.")
        self.location="nome_di_questa_pagina.htm"
        }
}

// -->
</script>


Html:

Adesso si devono inserire le domande, queste potranno essere posizionate in qualsiasi punto della vostra pagina web.

Selezionare tutto il codice nella finestra sotto, cliccando sulla forbice, quindi posizionatevi sul testo evidenziato e adoperare il tasto destro del mouse per l'operazione di copia ed incolla, trasferitelo nella vostra pagina web, in questo caso fra i tags: <body> e </body>

Codice:
<form action="#">
<p>Domanda 1 ?</p>
<input type=radio value="a" name="1" onClick="Engine(1, this.value)">risposta 1<br>
<input type=radio value="b" name="1" onClick="Engine(1, this.value)">risposta 2<br>
<input type=radio value="c" name="1" onClick="Engine(1, this.value)">risposta 3<br>
<input type=radio value="d" name="1" onClick="Engine(1, this.value)">risposta 4<br>

<p>Domanda 2 ?</p>
<input type=radio value="a" name="2" onClick="Engine(2, this.value)">risposta 1<br>
<input type=radio value="b" name="2" onClick="Engine(2, this.value)">risposta 2<br>
<input type=radio value="c" name="2" onClick="Engine(2, this.value)">risposta 3<br>
<input type=radio value="d" name="2" onClick="Engine(2, this.value)">risposta 4<br>

<p>Domanda 3 ?</p>
<input type=radio value="a" name="3" onClick="Engine(3, this.value)">risposta 1<br>
<input type=radio value="b" name="3" onClick="Engine(3, this.value)">risposta 2<br>
<input type=radio value="c" name="3" onClick="Engine(3, this.value)">risposta 3<br>
<input type=radio value="d" name="3" onClick="Engine(3, this.value)">risposta 4<br>

<input type=button onClick="NextLevel()" value="Test finito, accedi alla pagina">
</form>


Note:

Vediamo quali sono le modifiche da fare all'interno dello script, per poterlo adattare alle vostre esigenze:

ans[1] = "a";
Si riferisce alla prima domanda, quella a è relativa alla risposta, le possibili risposte sono 4: a, b, c, d; per cui se alla vostra prima domanda vorrete assegnare come risposta esatta la numero 3, dovrete sostituire quella a con una c; infatti: a =1, b=2, c=3, d=4 .

if (score > 9)
Sostituire il numero 9 con il numero di domande che avete previsto meno una, praticamente se le domande fossero 4 si dovrebbe mettere 3, serve per visualizzare il messaggio in caso fossero indovinate tutte le domande, i messaggi che trovate all'interno dello script ve li potete personalizzare come meglio credete, sono quelli preceduti dall'istruzione alert la parte modificabile è quella che si trova fra le doppie virgolette.

if (score >= 7 && score <= 10) Questo invece è il range entro il quale si stabilisce che il test o il quiz, sia superato; in questo esempio le domande sono 10 a noi bastavano almeno 7 risposte esatte, la formula dice che da 7 a 10 è consentito l'accesso alla pagina successiva. Nel caso fosse stato richiesto che tutte le domande dovevano essere indovinate, avremo adoperato al posto di 7 e 10 lo stesso numero massimo.

self.location="nome_della_tua_pagina_di_accesso.htm" Questa è l'istruzione che richiama: nome_della_tua_pagina_di_accesso.htm nel caso in cui il test fosse stato superato, sostituire quel nome_della_tua_pagina_di_accesso.htm con il nome della vostra pagina completo di eventuale URL.

self.location="nome_di_questa_pagina.htm" Questa è l'istruzione che richiama la stessa pagina in caso di test errato o di test che non ha raggiunto il risultato impostato. Sostituire quel nome_di_questa_pagina.htm col nome della vostra pagina in cui si trova questo test.



Questo sotto un esempio di test con 3 domande alle quali poter rispondere con 4 diverse possibilità:

Esempio


FONTE: WEB

Firma:

Ciao Carò Utente Hai un Problema o una Domanda? bhe allora Contattaci:

Email: info@natnox.com
Twitter: Natnox
Facebook: Natnox

EMINEM & RIHANNA
[Immagine: 9vJLLEP.gif][Immagine: AUpdxc9.gif]

Rispondi


(Questo messaggio è stato modificato l'ultima volta il: 05/03/2017, 19:54 da Natnox.)
Aggiorna il tuo account per nascondere gli annunci pubblicitari.




Utenti che stanno guardando questa discussione: 1 Ospite(i)