ラジオボタンのチェックって一度つけるとはずせないので、
チェックがついてるラジオをもう一度クリックすることではずせるようにしました。
選択解除ボタンを作ることでも可能ですが、ボタンがあると見た目が悪い時などに使えると思います。
ただし、一般的な動きではないので、「チェックの付いたらラジオをクリックすると未選択にできます。」等の注意書きはあったほうがいいと思います。
（jquery使用）
男 女
＜script type="text/javascript" src="jquery.min.js"＞＜/script＞
男 女
＜script type="text/javascript"＞
$(function() {
// ラジオにチェックが付いていてチェックしたらチェックはずす
$('input[type="radio"]').click(function () {
id = this.id;
name = $('#' + id).attr('name');
if ($('#' + id).hasClass('chkRadio')) {
$("input[name='" + name + "']").removeClass('chkRadio');
$('#' + id).attr('checked', false);
} else {
$("input[name='" + name + "']").removeClass('chkRadio');
$('#' + id).addClass('chkRadio');
}
});
// 全てのチェックのついたラジオにclassを設定
$('input[type="radio"]').each(function(){
id = this.id;
if ($('#' + id).attr('checked')) {
$('#' + id).addClass('chkRadio');
}
});
});
＜/script＞
「$(‘input[type=”radio:checked”]’).live()」みないなセレクタでできたら良かったんですが、
うまく動かなかったので、checkedの判定にclassを使用して判定しています。