mostra div solo se il checkbox è checked

**Bunz8** · 19-02-2015, 18:25

Salve, premetto non sono pratico di javascript
Ho bisogno di uno script che nasconda il div se il checkbox non è impostato.
ho trovato diversi script, ma funzionano tutti con l'evento click.

ho trovato questo esempio: http://www.dyn-web.com/tutorials/for...le-onclick.php
ma non funziona bene!!!

la mia pagina test è: http://mybiolife.it/test/show.php
lo script si attiva solo dopo un paio di click
come posso correggere questo errore
grazie anticipatamente per il vs aiuto
Bunz

**cavicchiandrea** · 19-02-2015, 20:16

<heah>
<script>
window.onload=function() {
var divhide = document.getElementById('active');
if ( document.getElementById('active_sub').checked ) {
divhide.style.display = 'block'; } else { divhide.style.display = 'none'; } }
</script>
</head>

**Bunz8** · 19-02-2015, 23:04

Grazie per il tuo aiuto!
ma non funziona bene! è scomparso il checkbox active
cosa ho sbagliato?

**cavicchiandrea** · 19-02-2015, 23:59

<heah>
<script>
window.onload=function() {
var divhide = document.getElementById('active_sub');
if ( document.getElementById('active').checked ) {
divhide.style.display = 'block'; } else { divhide.style.display = 'none'; } }
</script>
</head>

**carlomarx** · 20-02-2015, 01:56

Per completezza aggiungo alla soluzione proposta da Andrea una possibilità alternativa in puro CSS senza JavaScript…

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Esempio</title>
<style type="text/css">
input[type="checkbox"]:not(:checked) ~ .active_sub {
    display: none;
}
</style>
</head>

<body>

<fieldset>
    <legend>Demo: Show/Hide Related Onclick</legend>
    <input type="checkbox" name="show_sub" id="show_sub_input" value="1" />
    <label for="show_sub_input">Check if you engage in sports or fitness activities on a regular basis.</label>
    <div class="active_sub">
        <strong>Check which types</strong>
        <label><input name="sports[]" value="cycling" type="checkbox">cycling</label>
        <label><input name="sports[]" value="running" type="checkbox">running</label>
        <label><input name="sports[]" value="visit gym" type="checkbox">visit gym</label>
        <label><input name="sports[]" value="swimming" type="checkbox">swimming</label>
        <label><input name="sports[]" value="team sports" type="checkbox">team sport(s)</label>
        <label><input name="sports[]" value="other" type="checkbox">other</label>
    </div>
</fieldset>

</body>
</html>

**Bunz8** · 20-02-2015, 10:02

Grazie 1000, funziona!!!

la provo subito nelle mie pagine!!
grazie ancora!!!

Discussione: mostra div solo se il checkbox è checked

Strumenti discussione

Ricerca discussione

Visualizza

mostra div solo se il checkbox è checked

Tag per questa discussione

Permessi di invio