单选按钮在javascript中列出所选项目值

时间:2013-03-07 10:56:34

标签: javascript asp.net

我使用以下代码在单选按钮列表中获取所选元素值。

function SelectRadioButton()
{
   var radiobutton = document.getElementsByName('<%=RadioButtonList1.ClientID %>');
   alert(radiobutton.length);
for(var x = 0; x < radiobutton.length; x++)
            {
                if(radiobutton[x].checked)
                {
                    alert('selected is ' + radiobutton[x].id);
                }
             }
 }

以下是HTML标记

  <table id="ctl00_ContentPlaceHolder1_idControl_RadioButtonList1" class="chk" onclick="javascript:SelectRadioButton(this, ctl00_ContentPlaceHolder1_idControl_RadioButtonList1)" border="0">
    <tr>
        <td><input id="ctl00_ContentPlaceHolder1_idControl_RadioButtonList1_0" type="radio" name="ctl00$ContentPlaceHolder1$idControl$RadioButtonList1" value="1" checked="checked" /><label for="ctl00_ContentPlaceHolder1_idControl_RadioButtonList1_0">List</label></td><td><input id="ctl00_ContentPlaceHolder1_idControl_RadioButtonList1_1" type="radio" name="ctl00$ContentPlaceHolder1$idControl$RadioButtonList1" value="2" /><label for="ctl00_ContentPlaceHolder1_idControl_RadioButtonList1_1">Assignment</label>

但是我在警报(radiobutton.length)中得到长度为0;声明。 为什么会这样呢?我遗失的任何东西?

3 个答案:

答案 0 :(得分:2)

您可以使用jquery执行此操作。

 alert($(".chk").find("input:checked").length); // chk is your css class name applied to Checkbox List element.

您可以使用此

获取特定元素
alert($(".chk").find("input:checked")[0]);

答案 1 :(得分:1)

RadioButtonList1将转换为带有RadioButtonList1的ID的单选按钮,您可以遍历DOM并查找匹配的ids并将它们放入某个数组中或直接执行您想要的操作他们。

radiobutton = [];

for(i=0;i<document.forms[0].length;i++)
{
    e=document.forms[0].elements[i];
    if (e.id.indexOf("RadioButtonList1") != -1 )
    {
           radiobutton.push(e); 

    }       
}   

答案 2 :(得分:1)

如果您不想使用getElementById

,则仅使用javascript执行此操作

代码| JSFiddle

function SelectRadioButton(){
    var radiolist = getElementsByClass("table", "chk")[0],
        radios = radiolist.getElementsByTagName("input");

    for(var i = 0; i < radios.length; i++){
        if(radios[i].checked){
            alert('Selected radiobutton is ' + radios[i].id);
        }
    }
 }

function getElementsByClass(tag, name){
    var elements = document.getElementsByTagName(tag);
    var ret = [];

    for(var i = 0; i < elements.length; i++){
        if(elements[i].className.indexOf(name) !== -1){
            ret.push(elements[i]);
        }
    }

    return ret;
}