コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > html チェックボックスはすべての選択/選択のキャンセルを実装します_html/css_WEB-ITnose

html チェックボックスはすべての選択/選択のキャンセルを実装します_html/css_WEB-ITnose

WBOY
リリース： 2016-06-24 11:42:16
オリジナル
1309 人が閲覧しました

html checkbox  实现全选/取消全选




<html><body>	<table border="1">		<tr>			<th><input type="checkbox" onclick="swapCheck()" /></th>			<th>Month</th>			<th>Savings</th>		</tr>		<tr>			<td><input type="checkbox" /></td>			<td>January</td>			<td>$100</td>		</tr>		<tr>			<td><input type="checkbox" /></td>			<td>February</td>			<td>$150</td>		</tr>	</table>	<script type="text/javascript"		src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>	<script type="text/javascript">		//checkbox 全选/取消全选		var isCheckAll = false;		function swapCheck() {			if (isCheckAll) {				$("input[type='checkbox']").each(function() {					this.checked = false;				});				isCheckAll = false;			} else {				$("input[type='checkbox']").each(function() {					this.checked = true;				});				isCheckAll = true;			}		}	</script></body></html>
ログイン後にコピー



效果图：



関連ラベル：
html checkbox 实现全选/取消全选
ソース：php.cn
前の記事：Geek Academy では 1 か月間無料の VIP メンバーシップ体験を提供しています。福利厚生 福利厚生!_html/css_WEB-ITnose 次の記事：CSS3 シリーズ 4 (メディア クエリ モバイル デバイス スタイル)_html/css_WEB-ITnose
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
次のいずれかのチェックボックスをオフにした後、選択したチェックボックスを変更 (すべて選択) するにはどうすればよいですか? JSで全チェックスクリプトを作成しましたが、すべてのチェックボックスがまだチェックされているかどうかを確認し、チェックされていない場合は「すべて選択」チェックボックスをオフにする実...
から 2024-04-01 17:46:03
0
1
411
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート