获取和设置asp:RadioButtonList的值

最新推荐文章于 2022-11-04 23:24:26 发布

pengdayong77

最新推荐文章于 2022-11-04 23:24:26 发布

阅读量4.3k

点赞数

分类专栏： html 文章标签：选择asp控件

本文链接：https://blog.csdn.net/pengdayong77/article/details/50544856

版权

html 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

本文详细介绍了在ASP网页编程中如何通过jQuery选择并操作RadioButtonList控件，包括获取控件集的值、名称及设置选择状态。通过对比编译前后的代码结构，解释了控件是如何被微软编译并生成新的HTML标签形式，为开发者提供了一套实用的解决方案。

摘要由CSDN通过智能技术生成

今天项目需要获取和设置asp:RadioButtonList的值，以前做过。掉过这个坑。后来做好了。自然也就把这个坑给忘了。现在记录一下。避免下次又掉进这个坑中。

微软的aspx网页编程中。用JQuery的普通的选择器是不能够选择到所需要的asp控件的。这是因为在编译后,微软会把自己的asp控件编译成另一类控件。因此在实际编程的过程中需要根据最后生成的什么标签来获取控件。使用审核元素或查看源文件的方法去读取生成后的文件。

比如：在asp页面项目中如下代码

 <asp:RadioButtonList ID="rbn_list" runat="server">
       <asp:ListItem Text="Red" Value="10"></asp:ListItem>
        <asp:ListItem Text="Blue" Value="20"></asp:ListItem>
    </asp:RadioButtonList>

在最终生成的进候变成了下面的代码

<pre name="code" class="html"><pre name="code" class="html"><pre name="code" class="html"><table id="rbn_list" border="0" __id="19">
	<tbody><tr __id="20">
		<td __id="21"><input id="rbn_list_0" name="rbn_list" value="10" type="radio" __id="22"><label for="rbn_list_0" __id="23">Red</label></td>
	</tr><tr __id="24">
		<td __id="25"><input id="rbn_list_1" name="rbn_list" value="20" type="radio" __id="26"><label for="rbn_list_1" __id="27">Blue</label></td>
	</tr>
</tbody></table>

由以上可以看出微软自动生成了一个名字叫做rbn_list的控件集。并在它的后面生成一个标签。用于存放radioButton的值。因此如果要取得该控件的集的值的方法是

<span style="font-family:Arial, Helvetica, sans-serif;"></span><pre name="code" class="javascript"> $("[name=rbn_list]").each(function (index, obj) {
                alert($(this).val());
                //alert($(this).next().text());
            })

因此如果要取得该控件的集的名称值的方法是

<span style="font-family: Arial, Helvetica, sans-serif;"></span><pre name="code" class="javascript"> $("[name=rbn_list]").each(function (index, obj) {
                alert($(this).next().text());
            })

设置该控件被选择中的方法是

$("[name=rbn_list]").eq(1).prop("checked", "true");

或者

<pre name="code" class="javascript">var choise = $("[name=rbn_list][value=10]");
            choise.prop("checked","true");