Heim  >  Artikel  >  Web-Frontend  >  JS implementiert das Kontrollkästchen CheckBox, um alle und keine function_javascript-Fähigkeiten auszuwählen

JS implementiert das Kontrollkästchen CheckBox, um alle und keine function_javascript-Fähigkeiten auszuwählen

WBOY
WBOYOriginal
2016-05-16 16:00:501401Durchsuche

Das CheckBox-Steuerelement ist das, was wir im Allgemeinen als Kontrollkästchen bezeichnen und das normalerweise zum Aktivieren oder Deaktivieren einer Option verwendet wird. Dieses Steuerelement befindet sich im Dialogfeld „Einstellungen“ der meisten Anwendungen. Was wir sehen, was überprüft werden kann, ist die CheckBox.

Dieses Steuerelement gibt an, ob ein bestimmter Status (d. h. Option) ausgewählt (ein, Wert 1) oder gelöscht (aus, Wert 0) ist. Verwenden Sie dieses Steuerelement in Ihrer Anwendung, um dem Benutzer die Wahl zwischen „Wahr/Falsch“ oder „Ja/Nein“ zu bieten. Da CheckBoxen unabhängig voneinander funktionieren, können Benutzer eine beliebige Anzahl von CheckBoxen gleichzeitig auswählen, um Optionen zu kombinieren.

CheckBox JS implementiert die Funktion zum Auswählen und Abwählen aller. Es ist sehr einfach, fügen Sie einfach eine kleine js-Funktion ein. . .

<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>

Unten finden Sie eine Reihe von CheckBox-Checkbox-HTML-Codes
<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

Okay, Sie können den obigen Code kopieren, ändern und testen. . .

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn