ホームページ  >  記事  >  ウェブフロントエンド  >  JS は、すべてを選択するか選択しないための CheckBox チェックボックスを実装します。

JS は、すべてを選択するか選択しないための CheckBox チェックボックスを実装します。

WBOY
WBOYオリジナル
2016-05-16 16:00:501401ブラウズ

CheckBox コントロールは一般にチェック ボックスと呼ばれるもので、通常はオプションをオンまたはオフにするために使用されます。このコントロールは、ほとんどのアプリケーションの [設定] ダイアログ ボックス内にあります。チェックできるのは CheckBox です。

このコントロールは、特定の状態 (つまり、オプション) が選択されているか (オン、値 1)、クリアされているか (オフ、値 0) を示します。このコントロールをアプリケーションで使用して、ユーザーに「True/False」または「yes/no」の選択肢を提供します。チェックボックスは互いに独立して機能するため、ユーザーは同時に任意の数のチェックボックスを選択してオプションを組み合わせることができます。

CheckBox JS は、すべての選択とすべての選択を解除する機能を実装します。非常に簡単で、小さな 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>

以下は、CheckBox チェックボックスの HTML コードのセットです
<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

上記のコードをコピーし、変更してテストできます。 。 。

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。