Afficher/masquer div lorsque la case est cochée

Question

Je souhaite afficher/masquer une division lorsqu'une seule case est cochée. Il fonctionne actuellement avec "Sélectionner tout", mais je n'arrive pas à le faire fonctionner avec une seule case à cocher. Voici le code pour "Sélectionner tout":

JS:

<script language='JavaScript'> 
var checkboxcount = 1; 

function doCheckOne() { 
    if(checkboxcount == 0) { 
     with (document.messageform) { 
      for (var i=0; i < elements.length; i++) { 
       if (elements[i].type == 'checkbox') { 
        elements[i].checked = false; 
       document.getElementById('mail_delete_button').style.display = "none"; 
       } 
      } 
      checkboxcount = checkboxcount + 1; 
     } 
    } else 
    with (document.messageform) { 
     for (var i=0; i < elements.length; i++) { 
      if (elements[i].type == 'checkbox') { 
       elements[i].checked = true; 
      document.getElementById('mail_delete_button').style.display = "block"; 
      } 
     } 
    checkboxcount = checkboxcount - 1; 
    } 
} 
</script> 

HTML:

<a href="javascript:void(0);" onclick="doCheckAll();this.blur();">Select all</a> 
<div id="mail_delete_button" style="display: none;"></div> 

Je voudrais afficher la div "mail_delete_button" lorsqu'une seule case à cocher est sélectionné et le cache lorsqu'il n'y a rien de vérifié. Note: Mon champ html/entrée est sous la forme « messageform » Ceci est mon code d'entrée:

<input type='checkbox' name='delete_convos[]' value='{$pms[pm_loop].pmconvo_id}'> 

Toute aide serait grandement appréciée! Merci! :)

Answer 1

Quelque chose comme ça? A donné la case à cocher une id="chk"

<input type='checkbox' name='delete_convos[]' value='{$pms[pm_loop].pmconvo_id}' id="chk"> 

document.getElementById("chk").onclick = function() { 
    document.getElementById('mail_delete_button').style.display = this.checked ? "block" : "none"; 
}​ 

DEMO