web-dev-qa-db-ja.com

ラジオボタンのチェックを外す方法

2つのフォームがあり、1つはユーザーが編集するために選択する必要のあるラジオボタンが付いています。

_[form name="A"]
<li>[input type="radio" name="BookItem" value="1" /]</li>
<li>[input type="radio" name="BookItem" value="2" /]</li>
<li>[input type="radio" name="BookItem" value="3" /]</li>
[form]<p>
_

「BookItem」がフォームから選択された後（A）$("#EditFormWrapper").load("callEditData.cfm? ID="+ID);関数を呼び出して2番目のフォームをロードします（B）

_<div id="EditFormWrapper"><div></p>
<!---//  begin dynamic form generated by external file callEditData.cfm  //--->
[form id="editForm" name="B"]
<ul class="hourswrapper">
<li><input type="checkbox" id="TOR2Hours" class="TOR2Hours" name="TOR2Hours" value="AM2Hrs1" /> 2 Hours AM</li>
 <li><input type="checkbox" id="TOR2Hours" class="TOR2Hours" name="TOR2Hours" value="PM2Hrs1" /> 2 Hours PM</li>
<li><input type="checkbox" id="TOR2Hours" class="TOR2Hours" name="TOR2Hours" value="AM2Hrs2" /> 2 Hours AM</li>
 <li><input type="checkbox" id="TOR2Hours" class="TOR2Hours" name="TOR2Hours" value="PM2Hrs2" /> 2 Hours PM</li>
</ul>
[input type="image" src="images/submit-btn.gif" id="addBTN" name="addBTN" class="buttons" alt="SubmitRrequest" /]
[input type="image" src="images/cancel-btn.gif" id="editBTNcancel" name="editBTNcancel" class="buttons" alt="Cancel Request" /]
[/form]
<!---//  end dynamic form from external file //--->
_

ユーザーがフォーム（B）のキャンセルボタン（editBTNcancel）をクリックしたときにフォーム（A）のラジオボタンをオフにします。

これが私のスクリプトです：

_$("#editBTNcancel").live("click", function(event){
    event.preventDefault();
    $("#EditFormWrapper").slideUp("fast").empty();
    //$('.TOR2Hours').removeAttr('checked');
    $('.TOR2Hours').attr('checked', false);
});
_

私は私の問題を明確に述べてくれるといいのですが、どんな提案でも大歓迎です！

javascriptjqueryradio-buttondynamic-forms
16
user281867

あなたが何を望んでいるのか正確にはわかりませんが、リセット入力を使用してみてください。

<input type='reset' />
7
jeremysawesome

あなたはそのようなフォームにアクセスできます...

var exampleForm = document.forms['form_name'];

次にフォームをループします

for( var i=0; i<exampleForm.length; i++ ){
   alert( exampleForm[i].type );
}

あなたはそのようにチェックされているかテストすることができます...

if( exampleForm[i].checked )

チェックされたラジオボタンの選択を解除するには...

exampleForm[i].checked=false;

最終的なコードは次のようになります...

var exampleForm = document.forms['form_name'];
for( var i=0; i<exampleForm.length; i++ ){
   if( exampleForm[i].type ) == 'radio' && exampleForm[i].checked == true ){
       exampleForm[i].checked = false;
   }
}
11
brock

これは、最も簡単なDOMタスクであり、すべてのスクリプト可能なブラウザーで機能するため、jQueryメソッドを使用しないことをお勧めします。

$(".TOR2Hours")[0].checked = false;

もう1つ私に起こるのは、セレクターが正しいかどうかです。要素のセットをクラスで選択するつもりですか、それともIDセレクターにする必要がありますか？

3
Tim Down

セレクタが間違っています。最初のフォームのラジオボタンをオフにする場合は、$('input[name="BookItem"]')ではなく$('.TOR2Hours')を使用する必要があります。

$("#editBTNcancel").on("click", function(event){ $("#EditFormWrapper").slideUp("fast").empty(); $('input[name="BookItem"]').attr('checked', false); });

ラジオボタンをオフにするために使用する方法に関しては、次の3つの方法がすべて機能するはずです。

  1. $('input[name="BookItem"]').attr('checked', false);
  2. $('input[name="BookItem"]').removeAttr('checked');
  3. $('input[name="BookItem"]').prop('checked', false);

ただし、attr()とprop()の違いについては、jQueryのドキュメント jQuery prop（） を確認してください。

1
Joel Kornbluh

私はこの方法を使用してASP.netの問題を解決します。これを確認してください。

radioButton.InputAttributes["show"] = "false"; 
string clickJs = " if(this.show =='true'){this.show ='false'; this.checked = false;}else{this.show='true'; this.checked = true;};";  

radioButton.Attributes["onClick"] = clickJs;

asp.netでは、この方法を使用して属性を追加できます。また、radioButtonに属性を手動で追加し、関数（clickJs）を実行して、チェックされた属性を変更することもできます!!!

0
Jason SP Lin

この問題の優れた解決策を見つけました。

チェック/チェック解除できるようにする必要がある2つの無線があると想定して、このコードを実装し、必要なものを変更します。

var gift_click = 0;
    function HandleGiftClick() {
        if (document.getElementById('LeftPanelContent_giftDeed2').checked == true) {
            gift_click++;
            memorial_click = 0;
        }
        if (gift_click % 2 == 0) {document.getElementById('LeftPanelContent_giftDeed2').checked = false; }
    }
    var memorial_click = 0;
    function HandleMemorialClick() {          
        if (document.getElementById('LeftPanelContent_memorialDeed2').checked == true) {
            memorial_click++;
            gift_click = 0;
        }
        if (memorial_click % 2 == 0) { document.getElementById('LeftPanelContent_memorialDeed2').checked = false; }
    }

：） どういたしまして

0
Jacob Gaiski