Nascodi/Visualizza con click su checkbox

[bANART]

Buongiorno grandi esperti di JS!!!!! (...che paracu*o)

Ho un problema! (...e quando mai...)

Avete presente quel classico js che col click su un link fa apparire un div?
Ecco, l'ho applicato ad un checkbox e funziona, ma non funziona più il checkbox!
...nel senso che al click appare la parte di html del div di riferimento, ma non seleziona la casellina del checkbox!!

Il js è questo:

<script type="text/javascript" language="javascript">
    function disp(id){
      if (document.getElementById){
        if(document.getElementById(id).style.display == 'none'){
          document.getElementById(id).style.display = 'block';
        }else{
          document.getElementById(id).style.display = 'none';
        }
      }
    }
</script> 

..mentre l'html è questo:

<div id="testo"><a href="#" onclick="disp('zak'); return false">
Clicca qui per visualizzare il testo</a></div>
<div id="zak" style="display:none">testo nascosto!</div>


<div id="checkbox"><input type="checkbox" onclick="disp('puk'); return false" />
Clicca qui per visualizzare il testo</a></div>
<div id="puk" style="display:none">testo nascosto!</div> 

la seconda parte del codice html e quella del checkbox... sapreste dirmi come risolvere il problema?

Graziegrazie!!

[m4rko80]

devi levare il return false su onclick della checkbox, poi c'e' un </a> di troppo nella parte del checkbox. Altro accorgimento, per gli id non e' consigliato usare parole riservare all html, hai messo id="checkbox", cambialo

Se proprio ti serve il return false, prova a metterlo nella finzione e metti nell oclick="return nomeFunzione('...')".....

[bANART]

GRANDE MARCO!!!

L'id checkbox e l'</a> di troppo fanno parte dell'esempio che ho copiato erroneamente, mentre il return:false è la soluzione!!!!!

Ma a che serve?

Grazie mille!

[m4rko80]

Il return false puo' servire per bloccare un'altra azione tipo un submit di una form, anche se ci sono altri modi per bloccarla o comunque il return in una funzione puo tornare anche un valore per capire cos'e' avvenuto in base quello che gli hai passato ma non e' indispensabile per quello che stai facendo.

[bANART]

Grazie Marco, ma mi si è presentato un altro problema.

Non ho un solo checkbox, ne ho una serie, e la parte di testo nascosta mi deve apparire anche se altri checkbox sono selezionati... mi spiego meglio:

...se box1 è selezionato AND OR il box2 è selezionato AND OR il box3 è selezionato, mostra la parte html nascosta.

di seguito l'HTML (il js è quello di prima):

<div id="cbox01">
    <input type="checkbox" onclick="disp('dsp1');" />
    Box 1
</div>
<div id="cbox02">
    <input type="checkbox" onclick="disp('dsp1');" />
    Box 2
</div>
<div id="cbox03">
    <input type="checkbox" onclick="disp('dsp1');" />
    Box 3
</div>

<div id="dsp1" style="display:none">testo per box 1!</div> 

Giustamente, come è impostato ora, se clicco sul primo checkbox e poi sul secondo checkbox, la parte di testo nascosta prima mi appare e poi mi scompare, invece dovrebbe restare visibile.

Come posso risolvere questo problema?

[m4rko80]

Se non ho capito male per ogni checkbox devi visualizzare il testo corrispondente?
se si devi ovviamente cambiare l'id che passi alla funnzione

<div id="cbox01">
<input type="checkbox" onclick="disp('dsp1');" />
Box 1
</div>

<div id="cbox02">
<input type="checkbox" onclick="disp('dsp2');" />
Box 2
</div>
e cosi via...

[bANART]

non proprio... ti faccio un esempio:

I candidati potranno passare alle selezioni se uno dei seguenti requisiti è soddisfatto:
Possesso di laurea
Possesso di diploma
Possesso di attestato di master

<div id="cbox01">
    <input type="checkbox" onclick="disp('dsp1');" />
    Laurea
</div>
<div id="cbox02">
    <input type="checkbox" onclick="disp('dsp1');" />
    Diploma
</div>
<div id="cbox03">
    <input type="checkbox" onclick="disp('dsp1');" />
    Master
</div>

<div id="dsp1" style="display:none">Puoi passare alle selezioni!</div> 

Come è strutturato ora, se un utente ha sia la laurea e sia il master, cliccando su tutte e due i checkbox la scritta prima gli appare e poi gli scompare... invece dovrebbe restare visibile.
Cioè, se almeno una delle opzioni o più di una opzione è soddisfatta, la parte di html deve essere visibile.

[cavicchiandrea]

Prova cosi:

<script type="text/javascript" language="javascript"> 
var conta = 0
function disp(id){
      var box = document.getElementsByTagName("input")
for(var i=0; i<box.length; i++){
        if(box[i].type== 'checkbox' && box[i].checked){
conta++
}else{
conta--
}
}
if(conta>0){
          document.getElementById(id).style.display =  'block'; 
        }else{ 
          document.getElementById(id).style.display = 'none'; 
        } 
    } 
</script>

[bANART]

Ciao Andrea!
Ho provato come mi hai detto, ma non va...

Ho fatto così:

<html>
    <head>
        <script type="text/javascript" language="javascript"> 
            var conta = 0
            function disp(id){
                  var box = document.getElementsByTagName("input")
            for(var i=0; i<box.length; i++){
                    if(box[i].type== 'checkbox' && box[i].checked){
            conta++
            }else{
            conta--
            }
            }
            if(conta>0){
                      document.getElementById(id).style.display =  'block'; 
                    }else{ 
                      document.getElementById(id).style.display = 'none'; 
                    } 
                } 
        </script>
    </head>
    
    <body>
        <div id="cbox01">
            <input type="checkbox" onclick="disp('dsp1');" />
            Laurea
        </div>
        <div id="cbox02">
            <input type="checkbox" onclick="disp('dsp1');" />
            Diploma
        </div>
        <div id="cbox03">
            <input type="checkbox" onclick="disp('dsp1');" />
            Master
        </div>
        
        <div id="dsp1" style="display:none">testo per box 1!</div>
    </body>
</html> 

[cavicchiandrea]

<html>
    <head>
        <script type="text/javascript" language="javascript"> 

            function disp(id){
var conta = 0
                  var box = document.getElementsByTagName("input")
            for(var i=0; i<box.length; i++){
                    if(box[i].type == 'checkbox' && box[i].checked){
            conta=i+1
            }
alert(conta)
            if(conta>0){
                      document.getElementById(id).style.display =  'block'; 
                    }else{ 
                      document.getElementById(id).style.display = 'none'; 
}                     
                }
}
        </script>
    </head>
    
    <body>
        <div id="cbox01">
            <input type="checkbox" onclick="disp('dsp1');" />
            Laurea
        </div>
        <div id="cbox02">
            <input type="checkbox" onclick="disp('dsp1');" />
            Diploma
        </div>
        <div id="cbox03">
            <input type="checkbox" onclick="disp('dsp1');" />
            Master
        </div>
        
        <div id="dsp1" style="display:none">testo per box 1!</div>
    </body>
</html>