我有两种表单,一种带有单选按钮,用户必须选择该按钮才能编辑。
[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>
从表单 (A) 中选择“BookItem”后,我调用
$("#EditFormWrapper").load("callEditData.cfm? ID="+ID);
函数来加载第二个表单 (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);
});
我希望我清楚地说明我的问题,任何建议将不胜感激!
您可以像这样访问表格...
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;
}
}
我不确定你到底想要什么,但你可以尝试使用重置输入。
<input type='reset' />
由于这几乎是最简单的 DOM 任务并且适用于每个可编写脚本的浏览器,因此我建议不要使用 jQuery 方法:
$(".TOR2Hours")[0].checked = false;
我想到的另一件事是你的选择器是否正确。您的意思是按类选择一组元素还是应该使用 ID 选择器?
您的选择器根本就是错误的。 如果您想取消选中第一个表单中的单选按钮,您应该使用
$('input[name="BookItem"]')
而不是 $('.TOR2Hours')
:
$("#editBTNcancel").on("click", function(event){
$("#EditFormWrapper").slideUp("fast").empty();
$('input[name="BookItem"]').attr('checked', false);
});
至于使用哪种方法取消选中单选按钮,以下 3 种方法应该都有效:
$('input[name="BookItem"]').attr('checked', false);
$('input[name="BookItem"]').removeAttr('checked');
$('input[name="BookItem"]').prop('checked', false);
但是,请查看关于 jQuery prop() 的 jQuery 文档,了解
attr()
和 prop()
之间的区别。
我刚刚发现了这个问题的一个很好的解决方案。
假设您有两个无线电需要能够选中/取消选中,请实现此代码并更改必要的内容:
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; }
}
:)不客气
我用这种方式解决了你在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)来更改ckecked属性!!!
Array.prototype.forEach.call(auswahl_dachaufbau, function(rd) { // Event-Listener für Radio-Buttons rd.addEventListener("mousedown", function(e) { let id = e.target.id; if (this.checked) { reset_dachaufbau(id); // Das Setzen der onclick-function auf diese Weise ist dafür da, damit man // Radio-Buttons auch unchecked machen kann ohne einen neuen Radio-Button auszuwählen // Seltsamerweise ist das nicht möglich ohne weiteres this.onclick = function() { this.checked = false; } } else { this.onclick = null; select_dachaufbau(id); } }); });
Funktioniert 沉浸式