发布网友 发布时间:2022-04-23 22:08
共2个回答
懂视网 时间:2022-04-24 02:29
jquery mousedown修改td的样式无效的问题解决//样式 <style type="text/css"> #right td { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; font-size: 11px; padding: 6px 6px 6px 12px; color: #4f6b72; font-size: 15px; } td.alt { background: #F5FAFA; color: #797268; } img { max-width: 100px; max-height: 100px; } th { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; font-weight: bold; background: #4a98af; } tr.over td { background: #ecfbd4; /*这个将是鼠标高亮行的背景色*/ } td.selected, tr.even td.selected, tr.odd td.selected { background: #bce774; color: #555; } tr.click td, td.down { background: #bce774; color: #fff; } #right a { text-decoration: none; color: #057fac; } #right a:hover { text-decoration: none; color: #999; } </style> //脚本 <script type="text/javascript"> $(document).ready(function(){ $("#Clothes tr td").mousedown(function(){//鼠标按住时remove mouseenter时 td的样式。 $(this).removeClass("over");$(this).addClass("click");}) $("#Clothes tr td").mouseup(function(){//鼠标弹起时,清除td的样式 $(this).removeClass("click");}) $("#Clothes tr").mouseenter(function(){//鼠标进入tr添加样式.over $(this).addClass("over");}) $("#Clothes tr").mouseout(function(){ //鼠标离开tr,清除样式.over $(this).removeClass("over");}) $("#Clothes tr").click(function(){ //click tr时,添加样式.click $(this).addClass("click");$(this).siblings().removeClass("click");}) }); </script> <table id="Clothes"> <tr> <td style="width: 10%"> <td style="width: 20%"> <td style="width: 10%"> </tr> </table>
最佳答案:
<style type="text/css"> #right td { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; font-size: 11px; padding: 6px 6px 6px 12px; color: #4f6b72; font-size: 15px; } td.alt { background: #F5FAFA; color: #797268; } img { max-width: 100px; max-height: 100px; } th { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; font-weight: bold; background: #4a98af; } tr.over td { background: #ecfbd4; /*这个将是鼠标高亮行的背景色*/ } td.selected, tr.even td.selected, tr.odd td.selected { background: #bce774; color: #555; } tr.click td, td.down { background: #bce774; color: #fff; } #right a { text-decoration: none; color: #057fac; } #right a:hover { text-decoration: none; color: #999; } </style> <script type="text/javascript"> $(document).ready(function () { $("#right tr td").mousedown(function () {//鼠标按住时remove mouseenter时 td的样式。 $(this).removeClass("over"); $(this).addClass("click"); }) $("#right tr td").mouseup(function () {//鼠标弹起时,清除td的样式 $(this).removeClass("click"); }) $("#right tr").mouseenter(function () {//鼠标进入tr添加样式.over $(this).addClass("over"); }) $("#right tr").mouseout(function () { //鼠标离开tr,清除样式.over $(this).removeClass("over"); }) $("#right tr").click(function () { //click tr时,添加样式.click $(this).addClass("click"); $(this).siblings().removeClass("click"); }) }); </script> <body> <table id="right"> <tr> <td style="width: 10%">哈哈 </td> <td style="width: 20%">嘿嘿 </td> <td style="width: 10%">呵呵 </td> </tr> </table> </body>
本来你写的是正确的,但是你table里没有数据,所以刚加载页面的时候就什么也不显示,所以你得里面写数据,还有就是你整个样式都是基于right,但是你却在table里写的是Clothes,自己好好看看改改吧
热心网友 时间:2022-04-23 23:37
你在<td>中也要使用css来设置样式,而不是使用HTML的属性,比如: