Jump to content
tubarao21

Esconder DIV quando chekcbox's desmarcadas

Recommended Posts

tubarao21

Olá a todos!

Bem, muito noob em javascript.

Apanhei um script que agora tenho de finalizar. Não fui eu que o fiz, mas sou eu que vou acabar.

Ora bem, tenho um form com várias checkbox. Estas checkbox's têm o mesmo nome (formam um array).

Equivalem a apostas, marcando uma checkbox, aposta 0,10€, marcando duas, vale 0,20€ e por aí alem.

Quando uma checkbox é marcada, mostro uma div que contem o total de apostas (checkbox's marcadas) e valor total da aposta.

A questão é, desmarcando todas as checkbox's, teria de esconder a DIV que já mostrei.

Deixo algum código:

São várias checkbox's. Deixo apenas duas para simplificar:

<div id="chkbox">
<input name="prod2" onclick="Count(this, '01', 0)" value="01" type="checkbox" />
</div>

<div id="chkbox">
<input name="prod2" onclick="Count(this, '02', 1)" value="02" type="checkbox"/>
</div>

A função:

function Count(Checked, id, bucle)
{    
var Contador = 0;

for ( x = 0; x< 10; x++ )
{

if (document.boleto.prod2[x].checked)
    {
    Contador++;    

    var total = Contador * 0.10;

    var novo="<br/><div name='dinamico'>Valor: "+total+"</div><br/>";

document.getElementById("div_inicial").innerHTML=novo;
    } else {


}
}

Edited by thoga31
geshi

Share this post


Link to post
Share on other sites
brunoais

Tens que corrigir essa indentação. Só está a complicar.

Não mistures o javascript com o HTML como fizeste aqui:

<input name="prod2" onclick="Count(this, '02', 1)" value="02" type="checkbox"/>

Em vez disso, usa o getElementsByName para obteres os elementos que queres e usa o .onclick (property onclick) de cada um dos elementos que é retornado pelo getElementsByName para registares o evento de onclick nos vários checkboxes. Basta gravares uma referencia para a função que queres.

Depois, basta usares o

checkboxRef.checked

+ info: https://developer.mozilla.org/en-US/docs/HTML/Element/Input#attr-checked

Para saberes se a checkbox que estás a verificar está selecionada ou não.

Para percorreres o array basta usares um ciclo for (parecido com o que tens).

Cuidado com as variáveis não "declaradas". Enquanto não entenderes o que realmente está a fazer ao não declara-las, usa sempre o var para declarar as variáveis.

Para esconderes o div, basta teres um apontador para o div que queres.

Por exemplo, se o div for assim (no HTML):

<div id="result"></div>

então podes obter uma referencia para esse div assim:

var resultDiv = document.getElementById("result");

Depois, calculas o resultado da soma tendo em conta as checkboxes.

Usando esse resultado basta usares:

if(value > 0){
   resultDiv.style.display = "block";
}else{
   resultDiv.style.display = "none";
}

Há maneiras melhores de fazer isto mas já fazeres assim como indiquei já é muito bom para o teu nível.

Não te esqueças que o id é único por cada documento. O que tens no teu exemplo de código HTML está errado.

Edited by brunoais

"[Os jovens da actual geração]não lêem porque não envolve um telecomando que dê para mirar e atirar, não falam porque a trapalhice é rainha e o calão é rei" autor: thoga31

Life is a genetically transmitted disease, induced by sex, with death rate of 100%.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.