Maison > interface Web > js tutoriel > Implémentation JS d'exemples de code pour sélectionner tout et aucun

Implémentation JS d'exemples de code pour sélectionner tout et aucun

Guanhui
Libérer: 2020-07-28 18:27:26
avant
2757 Les gens l'ont consulté

Implémentation JS d'exemples de code pour sélectionner tout et aucun

L'exemple de cet article partage avec vous le code spécifique de js pour implémenter toutes les sélections et aucune sélection pour votre référence. Le contenu spécifique est le suivant

Quelques-uns. lignes de js natif très concis Pour réaliser toute sélection et aucune sélection, les maîtres peuvent ajouter la fonction de sélection inverse sur cette base.

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <title>全选、全不选</title>
</head>
<body>
<table border="1">
 <tr>
 <td><input type="checkbox" name="mmAll" onclick="All(this, &#39;mm[]&#39;)"></td>
 </tr>
 <tr><td><input type="checkbox" value="1" name="mm[]" class="check" id="ids1" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
 <tr><td><input type="checkbox" value="2" name="mm[]" class="check" id="ids2" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
 <tr><td><input type="checkbox" value="3" name="mm[]" class="check" id="ids3" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
 <tr><td><input type="checkbox" value="4" name="mm[]" class="check" id="ids4" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
 <tr><td><input type="checkbox" value="5" name="mm[]" class="check" id="ids5" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
 <tr><td><input type="checkbox" value="6" name="mm[]" class="check" id="ids6" onclick="Item(this, &#39;mmAll&#39;)"></td></tr>
</table>
</body>
</html>
<script type="text/javascript">
 //Check all
 function All(e, itemName)
 {
  var aa = document.getElementsByName(itemName);
  for (var i=0; i < aa.length; i++)
 
   aa[i].checked = e.checked; //得到那个总控的复选框的选中状态 
 }
 
 //Single select
 function Item(e, allName)
 {
  var all = document.getElementsByName(allName)[0];
  if(!e.checked) all.checked = false;
  else
  {
   var aa =document.getElementsByName(e.name);
   for (var i=0; i<aa.length; i++)
    if(!aa[i].checked) return;
   all.checked= true;
  }
 }
</script>
Copier après la connexion

Rendu :

Tutoriel recommandé : "Tutoriel JS"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:jb51.net
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal