チェックボックの複数選択と解除

投稿日:2010.02.25

▼javascript


<SCRIPT TYPE=”text/javascript”>
//——————————————————————————————————————
// CheckBoxの複数選択
//——————————————————————————————————————
var count;
function BoxChecked(check){
//id=day101〜
for(count = 0; count < 2; count++){
item_name=’day’+(101+count);
document.getElementById(item_name).checked = check;
}
}

var count;
function BoxChecked2(check){
//id=day201〜
for(count = 0; count < 3; count++){
item_name=’day’+(201+count);
document.getElementById(item_name).checked = check;
}
}
</SCRIPT>



▼html


<div>
<input name=”button” type=”button” onclick=”BoxChecked(true);” value=”全て選択” />
<input name=”button2″ type=”button” onclick=”BoxChecked(false);” value=”選択解除” />
</div>
<div>
<input name=”day101″ type=”checkbox” id=”day101″ value=”2/15(月)” />2/15(月)
<input name=”day102″ type=”checkbox” id=”day102″ value=”2/20(土)” />2/20(土)
</div>


<div>
<input name=”button” type=”button” onclick=”BoxChecked2(true);” value=”全て選択” />
<input name=”button2″ type=”button” onclick=”BoxChecked2(false);” value=”選択解除” />
</div>
<div>
<input name=”day201″ type=”checkbox” id=”day201″ value=”2/15(月)” />2/15(月)
<input name=”day202″ type=”checkbox” id=”day202″ value=”2/20(土)” />2/20(土)
<input name=”day203″ type=”checkbox” id=”day203″ value=”3/3(土)” />3/3(土)
</div>

PAGE TOP