jquery color class
先附上代码<table width="100%" border="0" cellspacing="1" cellpadding="0" > <tr height="27" align="center" style="color:#fff;"> <td width="17%" height="35" bgcolor="#19283e" class="th01">a</td> <td width="33%" height="35" bgcolor="#19283e" class="th01">b</td> <td width="10%" height="35" bgcolor="#19283e" class="th01">c</td> <td width="33%" height="35" bgcolor="#19283e" class="th01">d</td> <td width="8%" height="35" bgcolor="#19283e" class="th01">e</td> </tr> <tr> <td colspan="7" height="25" align="left" > <table height="26" width="100%" cellspacing="0" cellpadding="0" style="margin-top:10px; background:url(/images/main/img09.gif);"> <tr> <td style="padding-left:8px;" width="21"><img align='absmiddle' src='/UpFile/League/Icon_51001627082010.jpg' style="max-width:90%" style="max-width:90%"/ alt="onmouseover 反应慢 一闪就过去 是为啥？_html/css_WEB-ITnose" ></td> <td style="padding-left:7px;" class="txt09">a--- D1</td> </tr> </table> </td> </tr> <tr> <!-- <td colspan="5" align="center" class="txt10" style="padding-left:4px;"> <table width="100%" id="box-table-a"> <tr>--> <td align="center" style="padding-left:4px;">09/29 11:00</td> <td align="center" id="id1_415520" class="list_td" onclick="addCart('ggu12',415520,1,'SMP','2013-09-29 11:00/sh:ke/SMP');" onMouseover="highlight(this, true);" onMouseOut="highlight(this, false);" > <span style="float:left;">sh</span> <span style="float:right;">205</span></td> <td align="center" id="id0_415520" onMouseover="highlight(this, true);" onMouseOut="highlight(this, false);" class="list_td" onclick="addCart('ggu12','415520',0,'SMP','2013-09-29 11:00/sh:ke/SMP');" > 320 </td> <td class="list_td" id="id2_415520" class="list_td" onclick="addCart('ggu12',415520,2,'SMP','2013-09-29 11:00/sh:ke/SMP');" onMouseOver="highlight(this, true);" onMouseOut="highlight(this, false);"><span style="float:left;">3030</span><span style="float:right;">ke</span></td> <td align="center" style="background-color:#2b2b2b; cursor:arow;"><font color="#FFCC00">ppl</font></td> <!-- </tr> </table> </td>--> </tr></table><sript>function highlight(obj, isHover) { var cssClass = obj.className; //alert(cssClass); if(cssClass == "" || cssClass == "MouseOver") { obj.className = isHover ? "MouseOver" : ""; return; } var color = "#000000"; var oddColor = "#000000"; if(isHover) { //obj.style.backgroundImage = "url(/images/main/bg19.gif)"; //alert(cssClass); obj.style.backgroundColor = "#FFCC00"; obj.style.borderColor = "#ffe066 #907608 #907608 #ffe066"; } else { color = ""; oddColor = ""; obj.style.backgroundColor = ""; obj.style.borderColor = ""; //obj.style.backgroundImage = "url(/images/main/bg09.gif)"; } obj.style.color = color; // set color of this element var tds = obj.getElementsByTagName("TD"); // and all child TDs for (var i = 0; i < tds.length; i++) { if (tds[i].className == "odd") { tds[i].style.color = color; } else { tds[i].style.color = color; } } }</script> 以上代码里 tr是循环出来的。 我附上的是其中一个table的数据
问题是td里的 onmouseover/out 效果 反应慢 鼠标上去了有的不会变效果 在一个 td里来回一下才出现效果 有时还是一闪就没了。 不知道是什么原因 。有没有人知道？ 困惑了 2天 在不行 高手请求以上代码 改为 jquery的 也行 jquery 替代 onmouseover 效果。
回复讨论(解决方案)
<table width="100%" border="0" cellspacing="1" cellpadding="0" > <tr height="27" align="center" style="color:#fff;"> <td width="17%" height="35" bgcolor="#19283e" class="th01">a</td> <td width="33%" height="35" bgcolor="#19283e" class="th01">b</td> <td width="10%" height="35" bgcolor="#19283e" class="th01">c</td> <td width="33%" height="35" bgcolor="#19283e" class="th01">d</td> <td width="8%" height="35" bgcolor="#19283e" class="th01">e</td> </tr> <tr> <td colspan="7" height="25" align="left" > <table height="26" width="100%" cellspacing="0" cellpadding="0" style="margin-top:10px; background:url(/images/main/img09.gif);"> <tr> <td style="padding-left:8px;" width="21"><img align='absmiddle' src='/UpFile/League/Icon_51001627082010.jpg' style="max-width:90%" style="max-width:90%"/ alt="onmouseover 反应慢 一闪就过去 是为啥？_html/css_WEB-ITnose" ></td> <td style="padding-left:7px;" class="txt09">a--- D1</td> </tr> </table> </td> </tr> <tr> <!-- <td colspan="5" align="center" class="txt10" style="padding-left:4px;"> <table width="100%" id="box-table-a"> <tr>--> <td align="center" style="padding-left:4px;">09/29 11:00</td> <td align="center" id="id1_415520" class="list_td" onclick="addCart('ggu12',415520,1,'SMP','2013-09-29 11:00/sh:ke/SMP');" onMouseover="highlight(this, true);" onMouseOut="highlight(this, false);" > <span style="float:left;">sh</span> <span style="float:right;">205</span></td> <td align="center" id="id0_415520" onMouseover="highlight(this, true);" onMouseOut="highlight(this, false);" class="list_td" onclick="addCart('ggu12','415520',0,'SMP','2013-09-29 11:00/sh:ke/SMP');" > 320 </td> <td class="list_td" id="id2_415520" class="list_td" onclick="addCart('ggu12',415520,2,'SMP','2013-09-29 11:00/sh:ke/SMP');" onMouseOver="highlight(this, true);" onMouseOut="highlight(this, false);"><span style="float:left;">3030</span><span style="float:right;">ke</span></td> <td align="center" style="background-color:#2b2b2b; cursor:arow;"><font color="#FFCC00">ppl</font></td> <!-- </tr> </table> </td>--> </tr></table><script tepe="javascrit/text">function highlight(obj, isHover) { var cssClass = obj.className; //alert(cssClass); if(cssClass == "" || cssClass == "MouseOver") { obj.className = isHover ? "MouseOver" : ""; return; } var color = "#000000"; var oddColor = "#000000"; if(isHover) { //obj.style.backgroundImage = "url(/images/main/bg19.gif)"; //alert(cssClass); obj.style.backgroundColor = "#FFCC00"; obj.style.borderColor = "#ffe066 #907608 #907608 #ffe066"; } else { color = ""; oddColor = ""; obj.style.backgroundColor = ""; obj.style.borderColor = ""; //obj.style.backgroundImage = "url(/images/main/bg09.gif)"; } obj.style.color = color; // set color of this element var tds = obj.getElementsByTagName("td"); // and all child TDs for (var i = 0; i < tds.length; i++) { if (tds[i].className == "odd") { tds[i].style.color = color; } else { tds[i].style.color = color; } } }</script> 试试吧
2楼 没什么改变啊 就是 <script> 这个？？ 这个是 js文件里的 调用的。 <br /> <br /> 和这个没关系吧。。。。 </script>
发现 单独拿出来 html 保存的话 不卡 很正常。。 在 asp文件里循环输出的时候就 出毛病 。。
这个估计你的td太多了
请问这个效果 用 jquery 如何实现呢？
事件冒泡吧.. 改用jquery的 mosueEnter mouseLeave
LZ使用jquery实现的话，可以参照下面的：
var table = $("#table1"); // 假设table的id为table1function CreateTr() { var tr = $("<tr></tr>"); var td = GetTd(); $(td).appendTo(tr); $(tr).appendTo(table);}function GetTd() { var td = $("<td></td>"); $(td).bind("mouseenter", function() { // logic }); $(td).bind("mouseleave", function() { // logic }); return td;} 声明
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
＆gt; gt;的目的是什么 元素？Mar 21, 2025 pm 12:34 PM本文讨论了HTML＆lt; Progress＆gt;元素，其目的，样式和与＆lt; meter＆gt;元素。主要重点是使用＆lt; progress＆gt;为了完成任务和LT;仪表＆gt;对于stati
＆lt; datalist＆gt;的目的是什么。 元素？Mar 21, 2025 pm 12:33 PM本文讨论了html＆lt; datalist＆gt;元素，通过提供自动完整建议，改善用户体验并减少错误来增强表格。Character计数：159
＆lt; meter＆gt;的目的是什么。 元素？Mar 21, 2025 pm 12:35 PM本文讨论了HTML＆lt; meter＆gt;元素，用于在一个范围内显示标量或分数值及其在Web开发中的常见应用。它区分了＆lt; meter＆gt;从＆lt; progress＆gt;和前
视口元标签是什么？为什么对响应式设计很重要？Mar 20, 2025 pm 05:56 PM本文讨论了视口元标签，这对于移动设备上的响应式Web设计至关重要。它解释了如何正确使用确保最佳的内容缩放和用户交互，而滥用可能会导致设计和可访问性问题。
如何使用HTML5表单验证属性来验证用户输入？Mar 17, 2025 pm 12:27 PM本文讨论了使用HTML5表单验证属性，例如必需的，图案，最小，最大和长度限制，以直接在浏览器中验证用户输入。
我如何使用html5＆lt; time＆gt; 元素以语义表示日期和时间？Mar 12, 2025 pm 04:05 PM本文解释了HTML5＆lt; time＆gt;语义日期/时间表示的元素。 它强调了DateTime属性对机器可读性（ISO 8601格式）的重要性，并在人类可读文本旁边，增强Accessibilit
＆lt; iframe＆gt;的目的是什么。 标签？使用时的安全考虑是什么？Mar 20, 2025 pm 06:05 PM本文讨论了＆lt; iframe＆gt;将外部内容嵌入网页，其常见用途，安全风险以及诸如对象标签和API等替代方案的目的。
热AI工具
Undresser.AI Undress
人工智能驱动的应用程序，用于创建逼真的裸体照片
AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。
Undress AI Tool
免费脱衣服图片
Clothoff.io
AI脱衣机
AI Hentai Generator
免费生成ai无尽的。
热门文章
R.E.P.O.能量晶体解释及其做什么（黄色晶体）
3 周前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
3 周前By尊渡假赌尊渡假赌尊渡假赌
刺客信条阴影：贝壳谜语解决方案
1 周前ByDDD
R.E.P.O.如果您听不到任何人，如何修复音频
3 周前By尊渡假赌尊渡假赌尊渡假赌
在哪里可以找到原子中的起重机控制钥匙卡
1 周前ByDDD
热工具
SublimeText3 英文版
推荐：为Win版本，支持代码提示！
螳螂BT
Mantis是一个易于部署的基于Web的缺陷跟踪工具，用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。
Atom编辑器mac版下载
最流行的的开源编辑器
记事本++7.3.1
好用且免费的代码编辑器
SublimeText3 Mac版
神级代码编辑软件(SublimeText3)
