repeater 能实现隔行换色,也能实现鼠标悬停效果,但我想同时实现,单击某行,就让这一行处于被选 中状态,整行变为红色。

tiger8000 2012-01-13 02:25:30

repeater 能实现隔行换色,也能实现鼠标悬停效果,但我想同时实现,单击某行,就让这一行处于被选 中状态,整行变为红色。

请看我实现的一部分功能,我只能实现隔行换色和 鼠标悬停效果。



<asp:Repeater ID="Repeater1" OnItemDataBound="Repeater1_ItemDataBound" runat="server">
<HeaderTemplate>
<tr bgcolor="#add8e6">
<td height="25" class="tabletitle" align="center">ID</td>
<td class="tabletitle" align="center">状态</td>
<td class="tabletitle" align="center">消缺序号</td>
<td class="tabletitle" align="center">发现时间</td>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr bgcolor="#e6e6fa" style="cursor:hand" onmouseover="javascript:this.style.backgroundColor='#FFCC33';" onmouseout="javascript:this.style.backgroundColor='#e6e6fa';" ondblclick="openChild(this,<%#Eval("ID")%>,5)">
<td height="25" align="center"><%#Eval("ID")%></td>
<td><%#CheckState(Convert.ToString(Eval("StateNow")))%> </td>
<td><%#Eval("FlowOrder")%></td>
<td><%#Eval("FindDate")%></td>
</tr>
</ItemTemplate>
<AlternatingItemTemplate>
<tr bgcolor="#f5f5dc" style="cursor:hand" onmouseover="javascript:this.style.backgroundColor='#FFCC33';" onmouseout="javascript:this.style.backgroundColor='#f5f5dc';" ondblclick="openChild(this,<%#Eval("ID")%>,5)">
<td height="25" align="center"><%#Eval("ID")%></td>
<td><%#CheckState(Convert.ToString(Eval("StateNow")))%> </td>
<td><%#Eval("FlowOrder")%></td>
<td><%#Eval("FindDate")%></td>
</tr>
</AlternatingItemTemplate>
</asp:Repeater>





我的方法很简单,因为是 repeater ,所以我用了 ItemTemplate 和
AlternatingItemTemplate

在 ItemTemplate 里的行
<tr bgcolor="#e6e6fa" style="cursor:hand" onmouseover="javascript:this.style.backgroundColor='#FFCC33';" onmouseout="javascript:this.style.backgroundColor='#e6e6fa';" ondblclick="openChild(this,<%#Eval("ID")%>,5)">

首先为整行加一背景色 bgcolor="#e6e6fa" ,然后,用onmouseover 实现鼠标效果 用 onmouseout 实现鼠标移开后,恢复这行原来的背景色

,同理 在AlternatingItemTemplate 模板里也是这样实现。


现在就是不知道怎么才能实现 单击某行,就让这一行处于被选 中状态,整行变为红色。
然后,如果单击其它行,则让其它行处于被选 中状态,整行变为红色,让刚才那行恢复原来行的背景色。。




请各位高人帮帮忙!!万分感谢!!
...全文
393 16 打赏 收藏 转发到动态 举报
写回复
用AI写文章
16 条回复
切换为时间正序
请发表友善的回复…
发表回复
Trouble___Maker 2012-01-20
  • 打赏
  • 举报
回复
先添加一个Css
<style>.CurrentTr{background-color:red;}</style>

然后给repeter里面的tr加上onclick事件
<tr onclick="SetBack(this);">

<script>
function SetBack(item){
//先循环所有的Tr,删除class属性中的CurrentTr值
//参数this表示的是当前点击的Tr,直接在this上设置class="CurrentTr"就行了
//思路是这样,具体你自己写写看
}
</script>
李小冲 2012-01-19
  • 打赏
  • 举报
回复
onclick,修改所在行的style
  • 打赏
  • 举报
回复
repeater里加一个checkbox不行么?
  • 打赏
  • 举报
回复
你把问题搞复杂了,或者说没有技术层次。

动态改变一行的样式,动态改变其class属性(只是一个名称而已嘛)就行了,不用写一大堆内联样式代码硬编码到这里。你说的三种动作不过就是改变tr的class属性,这写成三条javascript代码显然比我这里的文字要少多了。
zioc2013 2012-01-15
  • 打赏
  • 举报
回复
如果又选中了行2 jquery设置行1 css设为原先css(你可以根据css来判断该给行1赋什么颜色,如果行1的css为css1,你就设置它为css1的颜色)
回头是岸 2012-01-15
  • 打赏
  • 举报
回复
前台js控制吧
zioc2013 2012-01-15
  • 打赏
  • 举报
回复
汗 多费劲啊

我觉得这个用脚本实现更好

建议楼主看看jquery吧

隔行换色:设置 css1 css2。。 css1套给普通item css2套给隔行item

鼠标悬停:css1:hover css2:hover

点击选中:假如选中行1。用jquery来改变行1的css从而改变颜色
zorro911 2012-01-14
  • 打赏
  • 举报
回复
原理不是一样的吗,oncilck或者onmousedown事件
hhh305743261 2012-01-13
  • 打赏
  • 举报
回复
手写的没测试过,也不知道对不对。
hhh305743261 2012-01-13
  • 打赏
  • 举报
回复
var tab=document.getElementById('tableID').getElementsByTagName('tr');
for(var j=0;j<tab.length;j++)
{
var color=j%2==0?'#e6e6fa':'#f5f5dc';//设置奇偶行中td背景色
var td=tab[j].getElementsByTagName('td');
for(var k=0;k<td.length;k++)
{
td[k].backgroundColor=color;
}
}
var td2=t.getElementsByTagName('td');
for(var i=0;i<td2.length;i++)
{
td2[i].backgroundColor='red';//设置选中行中的td背景
}
tiger8000 2012-01-13
  • 打赏
  • 举报
回复
不能 tab[j].backgroundColor='';/取消全部td背景


因为我原来

ItemTemplate 中的行和
AlternatingItemTemplate 中的行,是分别有不同颜色的啊
hhh305743261 2012-01-13
  • 打赏
  • 举报
回复
晕 改需求了
table中加ID t为this

function click(t)//点击
{
var tab=document.getElementById('tableID').getElementsByTagName('td');
for(var j=0;j<tab.length;j++)
{
tab[j].backgroundColor='';/取消全部td背景
}/
var td=t.getElementsByTagName('td');
for(var i=0;i<td.length;i++)
{
td[i].backgroundColor='red';//设置选中行中的td背景
}
}
hhh305743261 2012-01-13
  • 打赏
  • 举报
回复
标签tr中加事件 t为this

function click(t)//点击
{
var td=t.getElementsByTagName('td');
for(var i=0;i<td.length;i++)
{
td[i].backgroundColor='red';
}
}
function out(t)//退出
{
var td=t.getElementsByTagName('td');
for(var i=0;i<td.length;i++)
{
td[i].backgroundColor='';
}
}
tiger8000 2012-01-13
  • 打赏
  • 举报
回复
我知道,同理再为这行 tr 标签

加上

onclick="javascript:this.style.backgroundColor='#ff3333';" 就能实现单击这行变色

但是问题是,我鼠标一移开后,马上这行就触发了 onmouseout ,整行就恢复了原来行的颜色。

我的想法是,单击这行,处于选中状态,变色了以后,在没有单击别的行之前,这个选 中行,不管是 onmouseout 还是 onmouseover 都不变色,

只有单 击了其它行,有其它行处于选中状态了以后,这行才恢复原来颜色。
Im_Sorry 2012-01-13
  • 打赏
  • 举报
回复
可以在后台事件中 来进行判断,如果选择,应该是选中那一行~~~~ ,你给TR加个ID 然后搜索到之后用a什么开头的。添加STYLE属性!!
SomethingJack 2012-01-13
  • 打赏
  • 举报
回复
你既然会移开和移上去怎么不会点击之后- -额 其实直接判断是否触发oncilk事件就可以了
- -
源码下载地址: https://pan.quark.cn/s/a4b39357ea24 Altium Designer 18是一款功能丰富的电子设计自动化工具,其集成了电路原理图绘制、PCB布局规划、三维视图展示、电路仿真分析以及生产文件生成等多项核心功能,为电子工程师们提供了一个全面的硬件设计解决方案。该软件的官方文指导材料系统地阐述了从项目初始阶段到最终完成的全过程操作方法。 在“AD18 官方文指导材料”,使用者可以掌握以下核心内容要点: 1. **系统配置与界面认知**:熟悉Altium Designer 18的工作平台,涵盖菜单项、工具栏配置、工作区域安排,以及个性化工作界面的设定方法。 2. **项目创建流程**:掌握如何建立新的项目工程,包括工程参数配置、项目模板取,以及项目文件的添加操作。 3. **电路图绘制技术**:学习电路原理图的绘制流程,包括元件库的维护管理、元件放置技巧、连接线路绘制、属性编辑操作,以及网络表的自动生成方法。 4. **元件库构建与管理**:了解如何建立自定义元件库,执行元件的导入与导出任务,以及利用Altium Designer自带的元件资源库。 5. **PCB布局设计方法**:掌握PCB设计的基本准则,如元件布局策略、布线技巧、层叠结构调整、布线规则优化,以及冲突检测与短路处理技术。 6. **设计规范与约束条件**:理解设定设计规范和电气约束条件的关键性,包括间距参数设定、焊盘尺寸规格、过孔尺寸要求等,以及运用规则检查进行设计验证的流程。 7. **三维模型整合应用**:学习如何将三维模型与PCB设计内容相结合,以实现更为直观的机械配合验证。 8. **电路性能仿真技术**:掌握使用Altium Des...
源码链接: https://pan.quark.cn/s/a4b39357ea24 ### 接口测试知识要点说明 #### 一、接口测试的定义及分类 1. **概念阐释**: - 接口测试作为软件测试的关键环节,主要对系统之间的交互点进行验证。 - 它旨在核实接口的正确性、稳定性和功能性,保障各个系统组件能够依照预期执行交互操作。 2. **实施情境**: - 适用于多系统联合开发的环境。 - 适用于包含多个子系统的复杂应用系统开发过程。 3. **适用范围**: - 为其他系统提供支持的底层基础架构系统。 - 负责协调心服务的系统架构。 4. **分类标准**: - **模块接口测试**:通常作为单元测试的一部分,适用于独立构建的功能模块。 - **Web接口测试**: - **服务端接口测试**:针对客户端与服务器端之间的接口进行验证。 - **外部接口测试**:对第三方提供的接口进行测试,例如支付平台提供的授权登录接口。 5. **测试角度**: - **接口功能验证**:核实接口功能是否满足预期要求。 - **接口性能评估**:衡量接口的处理能力及响应时间。 - **接口稳定性考察**:检测接口在长时间运行的表现情况。 - **接口安全检测**:确保接口能够抵御非法访问或数据篡改。 6. **测试手法**: - **参数细致测试**:深入测试接口的输入参数和输出结果。 - **场景模拟测试**:依据实际业务场景进行测试验证。 #### 二、接口测试的详细流程 1. **测试规划**: - 明确测试范围、目标及所需资源。 - 规划测试策略,择适宜的工具和技术手段。 2. **测试用例设计**: - 依据需求文档和接口规格文档设计测试用例。 - 覆...
内容概要:本文研究基于遗传算法(GA)与粒子群算法(PSO)相结合的无人机三维路径规划方法,旨在解决无人机在复杂三维环境避障与路径优化的关键问题。通过构建包含障碍物、威胁区域等约束的三维仿真环境,系统实现了GA与PSO两种智能优化算法的Matlab代码,并对其在路径规划的性能进行全面对比分析,重点关注路径长度、飞行安全性、算法收敛速度等核心指标。研究充分利用GA的全局搜索能力与PSO的快速局部收敛特性,提出一种混合优化策略,有效克服单一算法易陷入局部最优或收敛缓慢的缺陷。文不仅详细阐述了算法的设计流程、数学模型与实现细节,还提供了完整的仿真结果,验证了所提混合方法在复杂动态场景下的优越性、有效性和鲁棒性,为无人机自主导航提供了可靠的理论依据和技术方案。; 适合人群:具备一定Matlab编程基础和优化算法理论知识,从事无人机系统设计、智能控制、路径规划、人工智能应用等相关领域研究的研究生、科研人员及工程技术人员。; 使用场景及目标:①应用于城市峡谷、山区、灾害救援等复杂三维环境的无人机自主避障与最优任务路径规划;②为智能优化算法(GA、PSO及其混合策略)的学习、性能对比与工程化应用提供详实的实践案例和代码参考;③服务于高校科研教学、算法原型快速复现、以及在此基础上的进一步改进与创新研究。; 阅读建议:建议读者结合所提供的Matlab代码进行仿真运行与调试,深入理解两种算法的参数设置、适应度函数设计及路径生成机制,可通过修改环境地图、增加动态障碍物或调整优化目标函数等方式进行扩展性研究,以深化对算法本质和应用场景的理解。

62,271

社区成员

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧