单击行，自动选中当前行中的单选框按钮代码,Asp.Net代码库,德仔网

代码语言

代码分类

【Asp.Net】单击行，自动选中当前行中的单选框按钮

作者:克非 / 发布于2015/2/28/ 723


	aspx页面：

	<asp:Repeater ID="rptRecordList" runat="server">
	 <HeaderTemplate>
	 <table style="width: 100%;" id="tbList">
	 </HeaderTemplate>
	 <ItemTemplate>
	 <tr class="order-item">
	 <td style="width: 96px;" class="item">
	 <span style="margin-right: 4px;"><%# Container.ItemIndex +1 %></span>
	 <input type="radio" name="rbtn" id="rbtn1" value='<%#Eval("hx_t_watermeterid")%>' />
	 </td>
	 <td style="width: 200px;" class="item"><%#Eval("name") %></td>
	 <td style="width: 200px;" class="item"><%#Eval("accountnumber") %></td>
	 <td class="last"><%#Eval("hx_fmetercode") %></td>
	 </tr>
	 </ItemTemplate>
	 <FooterTemplate>
	 </table></FooterTemplate>
	 </asp:Repeater>

	

	

	js代码：

	$(document).ready(function () {
	 //$("#tbList tr:odd").addClass("alt"); 偶数行样式
	 //$("#tbList tr:even").css("background-color", "white"); //奇数行样式
	 $("#tbList tr").hover(function () { $(this).addClass('overCss'); }, function () { $(this).removeClass('overCss'); }).click(
	 function (e) {
	 if ($(e.srcElement || e.target).attr("type") != "radio") {
	 $(this).find(":radio").click(); //$(this).find(":radio").attr("checked", true);有问题
	 }
	 });
	 $("#tbList input[type='radio']").click(function () {
	 $(this).parent().parent().addClass('clickCss')
	 .siblings().removeClass('clickCss')
	 .end();
	 });
	 });

	

	css样式：

	

	.altCss{
	background:#fff; /*这行将给所有的tr加上背景色*/
	}
	.overCss{
	background-color:#FEF2E8; /* #EEF2FB这个将是鼠标高亮行的背景色*/
	}
	.clickCss{background-color:#A7CDF0;} /*3385ff*/

试试其它关键字

　选中　

同语言下

可能有用的

克非贡献的其它代码(2)