使用OnClick事件

时间:2015-07-27 17:52:18

标签: javascript html forms radio-button

我有一个包含多个广播组的表单。我希望用户能够在不重置整个表单的情况下重置一个特定的无线电组。我创建了一个按钮,其值为Reset Participation Levels。以下是该按钮的click事件的功能:

<script>
function ParticipationReset(){
document.getElementById('SponsorshipParticipaton_0').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_1').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_2').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_3').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_4').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_5').removeAttribute('disabled');   
document.getElementById('SponsorshipParticipaton_6').removeAttribute('disabled');
document.getElementById('ExhibitorParticipaton_0').removeAttribute('disabled');
document.getElementById('ExhibitorParticipaton_1').removeAttribute('disabled');
document.getElementById('SponsorshipParticipaton_0').checked = false;   
document.getElementById('SponsorshipParticipaton_1').checked = false;   
document.getElementById('SponsorshipParticipaton_2').checked = false;   
document.getElementById('SponsorshipParticipaton_3').checked = false;   
document.getElementById('SponsorshipParticipaton_4').checked = false;   
document.getElementById('SponsorshipParticipaton_5').checked = false;   
document.getElementById('SponsorshipParticipaton_6').checked = false;   
document.getElementById('ExhibitorParticipaton_0').checked = false; 
document.getElementById('ExhibitorParticipaton_1').checked = false; 
}
</script>

但是,当我单击该按钮时,即使未在功能中指定,表单中的所有单选按钮也会重置。该页面的链接是www.pfacmeeting.org/2016/exhibitorform.htm。

任何建议都将不胜感激。谢谢

cdr6545

2 个答案:

答案 0 :(得分:1)

这种情况正在发生,因为按钮设置为“重置”,对于特定的重置,请将行更改为:

<input type="button" name="ResetSponsor" id="ResetSponsor" value="Reset Sponsorship Participation" onclick="javascript:SponsorshipReset(this);" />

型= “键”

答案 1 :(得分:0)

您可以使用简单的for循环重置组中的所有单选按钮,如下所示:

var elements = document.getElementsByName("SponsorshipParticipation");
for(var i = 0; i < elements.length; i++) {
    elements[i].removeAttribute("disabled");
    elements[i].checked = false;
}

或者,如果您要重置名称以“参与”结尾的所有单选按钮组,您可以将第一行更改为:

var elements = document.querySelectorAll("input[name$='Participation']");

以下是如何实现上面提供的代码的示例:

<强> HTML

<input type="button" value="Reset" onclick="resetParticipation()" />

<强>的JavaScript

function resetParticipation() {
    var elements = document.querySelectorAll("input[name$='Participation']");
    for(var i = 0; i < elements.length; i++) {
        elements[i].removeAttribute("disabled");
        elements[i].checked = false;
    }
}