单击行,自己主动选中当前行中的单选框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的更多相关文章
- .net dataGridView当鼠标经过时当前行背景色变色;然后【给GridView增加单击行事件,并获取单击行的数据填充到页面中的控件中】
1.首先在前台dataGridview属性中增加onRowDataBound属性事件 2.然后在后台Observing_RowDataBound事件中增加代码 protected void Obser ...
- angularjs中的单选框绑定数据注意事项
这里说的是angularjs 1.x 在实现单选框时,我们完全可以用html自带的<input type="radio"/>,但是配合angularjs 中的双向绑定, ...
- tkiner中Radiobutton单选框控件(七)
Radiobutton控件 由于本次内容中好多知识都是之前重复解释过的,本次就不做解释了.不太清楚的内容请参考tkinter1-6节中的内容 import tkinter wuya = tkinter ...
- tkinter中Radiobutton单选框控件(七)
Radiobutton控件 由于本次内容中好多知识都是之前重复解释过的,本次就不做解释了.不太清楚的内容请参考tkinter1-6节中的内容 import tkinter wuya = tkinter ...
- 四十二、在SAP中添加单选框
一.上代码 二.上文本替换截图 三.上效果图
- EasyUi datagrid 单选框选中事件
Easyui datagrid中的单选框默认是这样定义的 columns: [[ { field: 'CK', title: '', checkbox: true, width: 30 }]]. 平常 ...
- 在datagrid中实现单击行选择整行
首先添加列:<asp:ButtonColumn Text="选择" CommandName="Select" Visible="False&qu ...
- Asp.Net中GridView加入鼠标滑过的高亮效果和单击行颜色改变
转载自:http://www.cnblogs.com/fly_dragon/archive/2010/09/03/1817252.html protected void GridView1_RowDa ...
- jqgrid 单击行启用行编辑,切换行保存原编辑行
为了加速表格互动编辑,我们往往希望通过选中行就触发了行编辑,完成行编辑后,再选中另一个行做编辑,同时上一个编辑行被自动保存,直至完成需要的编辑内容. 页面效果可能如下: 1)设置需要编辑的列 edit ...
随机推荐
- C++大数据处理
转:http://blog.csdn.net/v_july_v/article/details/7382693 作者:July出处:结构之法算法之道blog 前言 一般而言,标题含有“秒杀”,“99% ...
- centos修改oracle字符集
1.首先以sysdba的身份登录上去 conn /as sysdba2.关闭数据库shutdown immediate;3.以mount打来数据库,startup mount4.设置session S ...
- 使用 Python 的 sounddevice 包录制系统声音
博客中的文章均为meelo原创,请务必以链接形式注明本文地址 sounddevice是一个与Numpy兼容的录音以及播放声音的包. 安装sounddevice包 直接通过pip就能安装. pip in ...
- NIO-2通道(Channel)
import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; import ...
- day4 二维数组旋转90度
二维数组的旋转其实就是数组里面的元素对调的情况:下面有一个4×4的二维数组,[[0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3], [0, 1, 2, 3]],现在要求把 ...
- react + redux 实现幻灯片
写在前面: 这一篇是我 使用scss + react + webpack + es6实现幻灯片 的进阶篇,效果请点我,将会使用上redux的基础用法,因为一开始没有理解好redux的用法,单纯看文档, ...
- UVA 1400."Ray, Pass me the dishes!" -分治+线段树区间合并(常规操作+维护端点)并输出最优的区间的左右端点-(洛谷 小白逛公园 升级版)
"Ray, Pass me the dishes!" UVA - 1400 题意就是线段树区间子段最大和,线段树区间合并,但是这道题还要求输出最大和的子段的左右端点.要求字典序最小 ...
- CodeForces 909D Colorful Points
题解: 暴力,模拟. 把字符串压缩一下,相同的处理成一位,记录下个数,然后暴力模拟即可. #include <bits/stdc++.h> using namespace std; con ...
- 洛谷P1552 [APIO2012] 派遣 [左偏树,树形DP]
题目传送门 忍者 Description 在一个忍者的帮派里,一些忍者们被选中派遣给顾客,然后依据自己的工作获取报偿.在这个帮派里,有一名忍者被称之为 Master.除了 Master以外,每名忍者都 ...
- 前端获取Base64字符串格式图片Ajax到后端处理
前端获取到的Base64字符串格式图片一般都是经过处理的图片,例如:裁剪过后的,这里假设data为获取到的Base64字符串格式图片 Base64格式图片的格式为 “data:image/png;ba ...