Visualizzazione dei risultati da 1 a 5 su 5
  1. #1

    Creare dello spazio tra dei checkbox

    Salve, volevo chiedervi un consiglio.
    Ho delle caselle checkbox inseriti in questo modo:
    <table>
    <tr>
    <td>
    <input type="checkbox" name="nome1" value="on"> testo
    </td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="nome2" value="on"> testo
    </td>
    </tr>
    <tr>
    <td>
    <input type="checkbox" name="nome3" value="on"> testo
    </td>
    </tr>
    </table>
    Vorrei che quando l'utente clicchi sul checkbox nome1, gli altri due checkbox verrebbero spostati verso il basso di un certo spazio e tra il checkbox nome1 e gli altri, comparisse del testo o del codice html.
    Se l'utente clicchi sul checkbox nome2 verrebbe spostato solo l'ultimo checkbox in basso e tra i due comparisse del testo o del codice html.
    Non so come si chiama questa operazione ne so neanche quale linguaggio utilizzare, suppongo che venga fatto con i css per cui ho postato il codice in questa sessione.
    Siccome non sò neanche da quale parte incominciare, se mi dite cosa studiare o qualche riferimento ad esempi, mi metto subito ad analizzare il problema.
    Grazie mille.
    Maria

  2. #2
    Ciao, potresti farlo generando contenuto da CSS ma te lo sconsiglio per problemi di compatibilità tra browser.
    Intanto elimina la tabella, non ti serve.
    Dopodiché usa JavaScript per intercettare l'evento "onclick" sulle checkbox, controlla la proprietà "checked", e quindi fai tutto quello che vuoi.
    Parti da questo:

    codice:
    window.onload = function () {
    
        document.getElementById('nome1').onclick = function () {
            if (this.checked)
    			alert(this.id + ' è stato cliccato!');
        }
    	
        document.getElementById('nome2').onclick = function () {
            if (this.checked)
    			alert(this.id + ' è stato cliccato!');
        }
    	
        document.getElementById('nome3').onclick = function () {
            if (this.checked)
    			alert(this.id + ' è stato cliccato!');
        }	
    }
    Per semplicità ho aggiunto gli ID agli input.

    Spero di esserti stato di aiuto

  3. #3
    Purtroppo non è quello che cerco, sicuramente mi sono spiegata io male ma la cosa è difficile anche a dirlo.
    Alert mi apre un messaggio a video mentre io cerco un'altra cosa.
    Faccio un esempio un po più facile ed indico con i simboli [] la casella checkbox
    Con l'html creo la seguente pagina:

    []bonifico
    []paypal
    []vaglia
    Se l'utente mette la spunta sul checkbox bonifico, l'output a video sarebbe il seguente:

    []bonifico
    avete scelto bonifico, ecco le coordinate
    ecc.
    ecc.
    []paypal
    []vaglia

    Se l'utente mette la spunta sul checkbox paypal, l'output a video sarebbe il seguente:

    []bonifico
    []paypal
    avete scelto l'ozione paypal, ecco i dati
    ecc.
    ecc.
    []vaglia

    Ovviamente tutto deve avvenire lato client, quando clicco su un checkbox deve apparirmi il testo sotto.
    Spero di essere stata più chiara.
    Grazie mille.
    Maria.

  4. #4
    Avevo capito benissimo, il mio codice era di esempio
    L'alert è solo per dimostrare che il controllo funziona.
    Al posto del suddetto puoi metterci qualsiasi cosa, per esempio potresti creare un <div> e inserirci dentro un nuovo paragrafo, dove ci scriverai quello che ti serve. Ecco un altro esempio di come fare una cosa del genere:
    codice:
    p = document.createElement('p');
    p.innerHTML = 'Avete scelto l'ozione PayPal, ecco i dati';
    document.getElementById("contenitore").appendChild(p);
    P.S.: JavaScript opera solo lato client

  5. #5

    Ok. Grazie

    Ti ringrazio, in settimana prossima proverò.
    Grazie ancora.
    Maria

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.