HTML で JavaScript の全選択/全選択解除操作を実行するサンプル コード

HTML で JavaScript の全選択/全選択解除操作を実行するサンプル コード

コードをコピー
コードは次のとおりです。

<html>
<ヘッド>
<meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=gb2312" />
<title>無題のドキュメント</title>
<script type="text/javascript" language="javascript">
関数 selectAllDels()
{
var allCheckBoxs = document.getElementsByName("preDelCheck");
var desc = document.getElementById("allChecked");
var selectOrUnselect=false;
for(var i = 0; i < allCheckBoxs.length; i++)
{
すべてのチェックボックスがチェックされている場合
選択または選択解除=true;
壊す;
}
}
if (選択または選択解除)
{
_allUnchecked(すべてのチェックボックス);
}それ以外
{
_allchecked(すべてのチェックボックス)
}
}
関数 _allchecked(allCheckBoxes){
for(var i = 0; i < allCheckBoxs.length; i++)
{
すべてのチェックボックス[i]がチェックされている = true;
}
}
関数 _allUnchecked(allCheckBoxes){
for(var i = 0; i < allCheckBoxs.length; i++)
{
すべてのチェックボックス[i].checked = false;
}
}
</スクリプト>
</head>
<本文>
<p>テスト</p>
<フォーム>
<input type="checkbox" name="preDelCheck" value="cream">ID1

<input type="checkbox" name="preDelCheck" value="sugar" >ID2

<input type="checkbox" name="preDelCheck" value="sugar">ID3

<input type="checkbox" name="preDelCheck" value="sugar">ID4

<input type="checkbox" name="preDelCheck" value="sugar">ID5

<input type="button" id="allChecked" value="すべて選択/すべて選択解除" onClick="selectAllDels()">
</フォーム>
</本文>
</html>

<<:  ウェブページ作成によく使われる英語フォント

>>:  nginx 用の zabbix 5.0 をインストールして展開する方法

推薦する

ウェブタイポグラフィにおける致命的な意味的ミス 10 選

<br />これは、Steven D が書いた Web フロントエンド開発デザインの基本...

Dockerを使用してNextCloudネットワークディスクを展開する方法

NextCloud コンピュータ上の任意のファイルやフォルダを共有し、NextCloud サーバーと...

ページのスクロールバーを無効にするには、overflow: hiddenを使用します。

コードをコピーコードは次のとおりです。 html {オーバーフロー: 非表示; }体{オーバーフロー...

Virtualbox に Centos7 仮想マシンをインストールする詳細なグラフィック チュートリアル

1. Centos7をダウンロードするダウンロードアドレス: https://mirrors.tun...

MySQL 4.1/5.0/5.1/5.5/5.6の主な違い

バージョン間でのコマンドの違い: innodb ステータスを表示\G mysql-5.1 エンジン ...

Vue はチャット ボックスで絵文字を送信する機能を実装します

vueチャットボックスで絵文字を送信し、vueインターフェースで絵文字を送信するための具体的なコード...

Win10 + Ubuntu 16.04 デュアルシステム 完璧なインストールチュートリアル [詳細]

必ずデータをバックアップすることを忘れないでください。データは貴重なものです! ! !コンピュータモ...

Vue で rem 適応を使用する方法

1. 開発環境vue 2. コンピュータシステム Windows 10 Professional E...

MySQL で特定の親行のすべての子行を見つけるソリューション

序文注: テストデータベースのバージョンはMySQL 8.0ですテーブルを作成し、ユーザー scot...

Nginx Webサーバーのサンプルコードの設定方法の詳細な説明

概要今日は主に、NGINX を Web サーバーとして設定する方法を共有します。内容は次のとおりです...

VPS はオフライン ダウンロード サーバーを構築します (ネットワーク ディスクの時代以降)

モチベーション学習の必要性から、海外のサーバーメーカー(どこのメーカーかは言いません)のVPSサービ...

MAC+PyCharm+Flask+Vue.js ビルドシステム

目次node.js+nvm+npm を設定するnpmスイッチタオバオミラーVue.jsをインストール...

MySQLのインデックス設計の原則と一般的なインデックスの違いについて簡単に説明します。

インデックス定義: ディスク上に保存される個別のデータベース構造であり、データ テーブル内のすべての...

GTK ツリービューの原理と使用法の分析

GtkTreeView コンポーネントは、美しい通常のリストやツリーのようなリストを作成できる高度な...

MySQLシリーズのMariaDBサーバーのインストール

目次チュートリアルシリーズ1. yumパッケージマネージャーを使用してMariaDBサーバーをインス...