Question

我需要在使用单选按钮列表呈现的多个单选按钮中添加一些javascript函数。而是将它们添加到动态创建的span中。见代码。

RAW html / aspx

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script type="text/javascript">
        function DisplayAlert() {
            alert('hahahahahahahahhahah');

        }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:RadioButtonList runat="server" ID="rblAmit" AutoPostBack="false" 
     DataTextField="Name" DataValueField="Id">  </asp:RadioButtonList>
        </div>
    </form>
</body>

呈现HTML

<div>
    <table id="rblAmit">
    <tr>
        <td><span onchange="javascript:DisplayAlert();"><input id="rblAmit_0" type="radio" name="rblAmit" value="A1" /><label for="rblAmit_0">Amit</label></span></td>
    </tr><tr>
        <td><span onchange="javascript:DisplayAlert();"><input id="rblAmit_1" type="radio" name="rblAmit" value="A2" /><label for="rblAmit_1">Ranjan</label></span></td>
    </tr><tr>
        <td><span onchange="javascript:DisplayAlert();"><input id="rblAmit_2" type="radio" name="rblAmit" value="A3" checked="checked" /><label for="rblAmit_2">Senior</label></span></td>
    </tr><tr>
        <td><span onchange="javascript:DisplayAlert();"><input id="rblAmit_3" type="radio" name="rblAmit" value="A4" /><label for="rblAmit_3">Software</label></span></td>
    </tr><tr>
        <td><span onchange="javascript:DisplayAlert();"><input id="rblAmit_4" type="radio" name="rblAmit" value="A5" /><label for="rblAmit_4">Engineer</label></span></td>
    </tr>
</table>

    </div>

CS-代码隐藏

private void FireEventOnLoad()
{

    foreach (ListItem item in rblAmit.Items)
    {
        item.Attributes.Add("onchange", "javascript:DisplayAlert();");
    }

    if (rblAmit.Items.FindByText("Senior") != null)
    {
        rblAmit.Items.FindByText("Senior").Selected = true;
    }
}

或

任何方式，以便我可以从RadioButtonList枚举RadioButtons。目前我正在获得一个Key Value对列表。

Answer 1

OnChange事件与value属性可以更改的元素相关联。您可以使用onclick事件，这将委托给span。下的input元素。

private void FireEventOnLoad()
{

    foreach (ListItem item in rblAmit.Items)
    {
        item.Attributes.Add("onclick", "javascript:DisplayAlert();");
    }

    if (rblAmit.Items.FindByText("Senior") != null)
    {
        rblAmit.Items.FindByText("Senior").Selected = true;
    }
}

Answer 2

使用Jquery。将ID提供给容器DIV。

编写Javascript函数并在radiobutton list refresh上调用该函数。

javascript函数的一部分 -

$('#container :radio').each(function(){
// attach onclick event.
 });

将属性添加到radiobuttonlist的单选按钮

2 个答案: