需求:单击行,自己主动选中当前行中的单选框button。



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*/

单击行,自己主动选中当前行中的单选框button的更多相关文章

  1. .net dataGridView当鼠标经过时当前行背景色变色;然后【给GridView增加单击行事件,并获取单击行的数据填充到页面中的控件中】

    1.首先在前台dataGridview属性中增加onRowDataBound属性事件 2.然后在后台Observing_RowDataBound事件中增加代码 protected void Obser ...

  2. angularjs中的单选框绑定数据注意事项

    这里说的是angularjs 1.x 在实现单选框时,我们完全可以用html自带的<input type="radio"/>,但是配合angularjs 中的双向绑定, ...

  3. tkiner中Radiobutton单选框控件(七)

    Radiobutton控件 由于本次内容中好多知识都是之前重复解释过的,本次就不做解释了.不太清楚的内容请参考tkinter1-6节中的内容 import tkinter wuya = tkinter ...

  4. tkinter中Radiobutton单选框控件(七)

    Radiobutton控件 由于本次内容中好多知识都是之前重复解释过的,本次就不做解释了.不太清楚的内容请参考tkinter1-6节中的内容 import tkinter wuya = tkinter ...

  5. 四十二、在SAP中添加单选框

    一.上代码 二.上文本替换截图 三.上效果图

  6. EasyUi datagrid 单选框选中事件

    Easyui datagrid中的单选框默认是这样定义的 columns: [[ { field: 'CK', title: '', checkbox: true, width: 30 }]]. 平常 ...

  7. 在datagrid中实现单击行选择整行

    首先添加列:<asp:ButtonColumn Text="选择" CommandName="Select" Visible="False&qu ...

  8. Asp.Net中GridView加入鼠标滑过的高亮效果和单击行颜色改变

    转载自:http://www.cnblogs.com/fly_dragon/archive/2010/09/03/1817252.html protected void GridView1_RowDa ...

  9. jqgrid 单击行启用行编辑,切换行保存原编辑行

    为了加速表格互动编辑,我们往往希望通过选中行就触发了行编辑,完成行编辑后,再选中另一个行做编辑,同时上一个编辑行被自动保存,直至完成需要的编辑内容. 页面效果可能如下: 1)设置需要编辑的列 edit ...

随机推荐

  1. C++的黑科技(深入探索C++对象模型)

    周二面了腾讯,之前只投了TST内推,貌似就是TST面试了 其中有一个问题,“如何产生一个不能被继承的类”,这道题我反反复复只想到,将父类的构造函数私有,让子类不能调用,最后归结出一个单例模式,但面试官 ...

  2. 图像显著性论文(一)—A Model of saliency Based Visual Attention for Rapid Scene Analysis

    这篇文章是图像显著性领域最具代表性的文章,是在1998年Itti等人提出来的,到目前为止引用的次数超过了5000,是多么可怕的数字,在它的基础上发展起来的有关图像显著性论文更是数不胜数,论文的提出主要 ...

  3. Vim文本编辑命令

    Vim Vim是一个类似于Vi的著名的功能强大.高度可定制的文本编辑器,在Vi的基础上改进和增加了很多特性.[1]  VIM是自由软件. Vim普遍被推崇为类Vi编辑器中最好的一个,事实上真正的劲敌来 ...

  4. 简易代理服务器之python实现

    代理服务器是在client和server之间的一个服务器,一般起到缓存的作用,所以也叫缓存服务器.比如: A ----(HTTP)----> B ----(HTTP)----> C 其中A ...

  5. CSU 1424 Qz’s Maximum All One Square

    原题链接:http://acm.csu.edu.cn/OnlineJudge/problem.php?id=1424 逐渐找到做这种题的感觉了. 二分法.g[i][j]存储坐标(i, j)的值,s[i ...

  6. EF – 4.CRUD与事务

    5.6.1 <Entity Framework数据更新概述>  首先介绍Entity Framework实现CRUD的基本方法,接着介绍了如何使用分部类增强和调整数据实体类的功能与行为特性 ...

  7. 超简教程:Xgboost在Window上的安装(免编译)

    Xboost在windows安装需要自己编译,编译的过程比较麻烦,而且需要复杂的软件环境.为了免去编译,我这里把编译好的文件上传到网盘供大家下载安装.有了编译好的文件,xgboost的安装变得超级简单 ...

  8. ftp缓存信息

    using System.Collections.Generic; using NewTempo.Ftp; using System.IO; using NshowAdClient.NshowAdSe ...

  9. thinkphp5.0读取配置

    读取配置参数 设置完配置参数后,就可以使用get方法读取配置了,例如: echo Config::get('配置参数1'); 系统为get方法定义了一个助手config,以上可以简化为: echo c ...

  10. POJ 1597 Function Run Fun

    记忆化搜索. #include<cstdio> #include<cstring> #include<cmath> #include<algorithm> ...