Maison > interface Web > js tutoriel > JS implémente la case à cocher CheckBox pour sélectionner toutes les compétences function_javascript et aucune

JS implémente la case à cocher CheckBox pour sélectionner toutes les compétences function_javascript et aucune

WBOY
Libérer: 2016-05-16 16:00:50
original
1454 Les gens l'ont consulté

Le contrôle CheckBox est ce que nous appelons généralement une case à cocher, qui est généralement utilisée pour activer ou désactiver une option. Ce contrôle se trouve dans la boîte de dialogue Paramètres de la plupart des applications. Ce que nous voyons qui peut être vérifié, c'est le CheckBox.

Ce contrôle indique si un état spécifique (c'est-à-dire une option) est sélectionné (on, valeur 1) ou effacé (off, valeur 0). Utilisez ce contrôle dans votre application pour proposer à l'utilisateur un choix « Vrai/Faux » ou « Oui/non ». Étant donné que les CheckBox fonctionnent indépendamment les unes des autres, les utilisateurs peuvent sélectionner n'importe quel nombre de CheckBox en même temps pour combiner les options.

CheckBox JS implémente la fonction de tout sélectionner et de tout désélectionner. C'est très simple, il suffit d'insérer une petite fonction js. . .

<script language="javascript">
 function  cli(Obj)
 {
 var collid = document.getElementByIdx_x("all")
 var coll = document.getElementsByName(Obj)
 if (collid.checked){
   for(var i = 0; i < coll.length; i++)
    coll[i].checked = true;
 }else{
   for(var i = 0; i < coll.length; i++)
    coll[i].checked = false;
 }
 }
 </script>
Copier après la connexion

Vous trouverez ci-dessous un ensemble de codes HTML de case à cocher CheckBox
<input name='多选项名称' type='checkbox' value='' id="all" onclick="cli('多选项名称');"> 全选
<input name='多选项名称' type='checkbox' value='' > A
<input name='多选项名称' type='checkbox' value='' > B
<input name='多选项名称' type='checkbox' value='' > C
<input name='多选项名称' type='checkbox' value='' > D
<input name='多选项名称' type='checkbox' value='' > E
<input name='多选项名称' type='checkbox' value='' > F
Copier après la connexion

D'accord, vous pouvez copier le code ci-dessus, le modifier et le tester. . .

Ce qui précède représente l’intégralité du contenu de cet article, j’espère que vous l’aimerez tous.

Étiquettes associées:
source:php.cn
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