jQueryのattrとremoveAttrを使って複数のcheckbox(チェックボックス)のチェック/解除を制御

attrとremoveAttrを使用して複数のcheckbox(チェックボックス)を制御して見ます。

1.CSSの記述例

(以下は任意ですので調整してみて下さい)

<style type="text/css">
<!--
#idWrap{
	width:800px;
	margin:0 auto;
}
-->
</style>

2.読み込むJsファイルとJavaScritpの記述例

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
<script type="text/javascript">
function fncchk(param){
	if(param=="on"){
		$('input[type="checkbox"]').attr("checked", true);
	}else{
		$('input[type="checkbox"]').removeAttr('checked');
	}
}
</script>

3.HTMLの記述例

<div align="center">
    <input type="button" onclick="fncchk('on')" value="チェック">  <input type="button" onclick="fncchk('off')" value="解除">


<input type="checkbox" name="chk" value="1"> 
<input type="checkbox" name="chk" value="2"> 
<input type="checkbox" name="chk" value="3"> 
<input type="checkbox" name="chk" value="4">
</div>

jQueryのattrとremoveAttrを使用し複数のcheckbox(チェックボックス)をチェック/解除するデモ

チェックボックスの制御ってデフォルトのチェックボックスだったら良いのですが、jQueryとかでカスタム(デザイン)されたものって制御が面倒な気がします。