ラジオボタン選択後にチェックしたものを外したい場合があります。
Javascriptを使用すればチェックしたラジオボタンをリセットすることが可能です。
Javascriptを使用し選択されているラジオボタンのチェックを外す方法をメモします。
■ 選択したラジオボタンのチェックを外す
【HTML】
チェックを外すためのリンクを用意し、クリックした際にJavascriptを呼び出します。
<a href="javascript:void(0);" onclick="resetradio()">リセット</a>
ラジオボタンのidを連番で指定します。
<label for="radio1"><input type="radio" name="hoge" id="radio1" value="1" />ラジオボタン1</label> <label for="radio2"><input type="radio" name="hoge" id="radio2" value="2" />ラジオボタン2</label> <label for="radio3"><input type="radio" name="hoge" id="radio3" value="3" />ラジオボタン3</label> <label for="radio4"><input type="radio" name="hoge" id="radio4" value="4" />ラジオボタン4</label> <label for="radio5"><input type="radio" name="hoge" id="radio5" value="5" />ラジオボタン5</label>
【javascript】
呼び出されたらラジオボタンの数だけfor文でループさせ、ラジオボタンのチェックを外しています。
<script type="text/javascript">
function resetradio() {
for (i = 1; i <= 5; i++) {
document.getElementById('radio' + i).checked = false;
}
}
</script>
