20分提问: 改变tr的class值的问题 提示一下:JS中是用className而不是class..... 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 "我看过遍历table的,我这个应该可以实现,但我不知道怎么改"--这一句看不明白..不知道是不是这样...<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>test</title><style type="text/css"><!--.class1 { font-size:16px; font-family:Verdana,sans-serif; background-color:#400000; color:white;}.class2 { font-size:12px; background-color:#CCC;}table { border:1px solid #008000; width:300px;}--></style><script type="text/javascript"><!-- function changeTrStyle(tr) { tr.className = "class1"; }--></script></head><body><table> <tr class="class2" onclick="changeTrStyle(this);"><td>111</td><td>111</td></tr> <tr class="class2"><td>222</td><td>222</td></tr></table></body></html> 每个<tr onclick="changeTrStyle(this);">都要有加oncick function changeTrStyle(tr) { tr.className = "class1"; }函数同时设其他tr的class为空其实用id更好,Id 是唯一的,先查Id 删除,再设function changeTrStyle(tr) { var tid=getelementbyid("myid") tid.value="" this.id="myid" }//上面的不一定正确,但就是那个意思<table> <tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this) > <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr> </table> fxs_2008方法不错试了一下<script>function changeTrStyle(tr) { var tid=document.getElementById("myid") ; tid.id="" ; tr.id="myid" ; } </script><style>#myid{font-size:16px; font-family:Verdana,sans-serif; background-color:#400000; color:white;}</style><em id="myid"></em><table border=1> <tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)" id="" > <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr> </table> 修改二楼 实现取消别的tr样式<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>test</title><style type="text/css"><!--.class1 { font-size:16px; font-family:Verdana,sans-serif; background-color:#400000; color:white;}.class2 { font-size:12px; background-color:#CCC;}table { border:1px solid #008000; width:300px;}--></style><script type="text/javascript"><!-- var oldTr; function changeTrStyle(tr) { tr.className = "class1"; if(oldTr) { oldTr.className = "class2"; } oldTr = tr; }--></script></head><body><table> <tr class="class2" onclick="changeTrStyle(this);"><td>111</td><td>111</td></tr> <tr class="class2" onclick="changeTrStyle(this);"><td>222</td><td>222</td></tr></table></body></html> 5楼也正确但html有冗余em id="myid"></em> 可加if语句判断<script>function changeTrStyle(tr) { var tid=document.getElementById("myid") ; if(tid) { tid.id=""; } tr.id="myid"; } </script><style>#myid{font-size:16px; font-family:Verdana,sans-serif; background-color:#400000; color:white;}</style><table border=1><tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr> <tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr> </table> 实践出真理6楼的再改下就好了:<script type="text/javascript"> <!-- var oldTr; function changeTrStyle(tr){ if(oldTr) { oldTr.className = "class2"; } tr.className = "class1"; oldTr = tr; } --> </script>就是把if语句放前面去了,这样的话,如果只有一行,那么这一行的颜色不会变了! 给你个类似的吧,不知道有用吗:<script>var obj = null;function hilight() { var e=window.event.srcElement; e=e.parentElement; if(e.tagName!="TR") return; if(obj!=null) obj.runtimeStyle.backgroundColor=""; obj=e; obj.runtimeStyle.backgroundColor="#FFE28C";}</script><table border=1><tr onclick='hilight();'><td>aa</td></tr><tr onclick='hilight();'><td>bb</td></tr><tr onclick='hilight();'><td>cc</td></tr></table> 话说php真的无法获取到404的上个URL么 php问题 php操作MYSQL 语句条件是越多越好还是越少越好呢 新手提问 PHP ascii码解码 关于搜索速度的问题!!!! 【求助】PHP二维数组 去除特定重复值的问题 难以搞定的sql语句!请帮忙一起讨论! 跳转刷新 用PHP怎知道用户的浏览器信息? 能把Javascript的数组传递到PHP中么 我要开发中型网站了,大家建议php好书吧,最好能找到电子版的哦!
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css">
<!--
.class1 {
font-size:16px;
font-family:Verdana,sans-serif;
background-color:#400000;
color:white;
}
.class2 {
font-size:12px;
background-color:#CCC;
}table {
border:1px solid #008000;
width:300px;
}-->
</style>
<script type="text/javascript">
<!--
function changeTrStyle(tr) {
tr.className = "class1";
}
-->
</script>
</head><body>
<table>
<tr class="class2" onclick="changeTrStyle(this);"><td>111</td><td>111</td></tr>
<tr class="class2"><td>222</td><td>222</td></tr>
</table>
</body>
</html>
tr.className = "class1";
}
函数同时设其他tr的class为空
其实用id更好,Id 是唯一的,先查Id 删除,再设function changeTrStyle(tr) {
var tid=getelementbyid("myid")
tid.value=""
this.id="myid"
}//上面的不一定正确,但就是那个意思<table>
<tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this) > <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)> <td> 111 </td> <td> 111 </td> </tr>
</table>
试了一下<script>
function changeTrStyle(tr) {
var tid=document.getElementById("myid") ;
tid.id="" ;
tr.id="myid" ;
}
</script>
<style>
#myid{font-size:16px;
font-family:Verdana,sans-serif;
background-color:#400000;
color:white;}
</style><em id="myid"></em>
<table border=1>
<tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)" id="" > <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)" id=""> <td> 111 </td> <td> 111 </td> </tr>
</table>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style type="text/css">
<!--
.class1 {
font-size:16px;
font-family:Verdana,sans-serif;
background-color:#400000;
color:white;
}
.class2 {
font-size:12px;
background-color:#CCC;
}table {
border:1px solid #008000;
width:300px;
}-->
</style>
<script type="text/javascript">
<!--
var oldTr;
function changeTrStyle(tr) {
tr.className = "class1";
if(oldTr)
{
oldTr.className = "class2";
}
oldTr = tr;
}
-->
</script>
</head><body>
<table>
<tr class="class2" onclick="changeTrStyle(this);"><td>111</td><td>111</td></tr>
<tr class="class2" onclick="changeTrStyle(this);"><td>222</td><td>222</td></tr>
</table>
</body>
</html>
但html有冗余em id="myid"></em> 可加if语句判断
<script>
function changeTrStyle(tr) {
var tid=document.getElementById("myid") ;
if(tid)
{
tid.id="";
}
tr.id="myid";
}
</script>
<style>
#myid{font-size:16px;
font-family:Verdana,sans-serif;
background-color:#400000;
color:white;}
</style>
<table border=1>
<tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr>
<tr onclick="changeTrStyle(this)"> <td> 111 </td> <td> 111 </td> </tr>
</table>
<script type="text/javascript">
<!--
var oldTr;
function changeTrStyle(tr){
if(oldTr)
{
oldTr.className = "class2";
}
tr.className = "class1";
oldTr = tr;
}
-->
</script>就是把if语句放前面去了,这样的话,如果只有一行,那么这一行的颜色不会变了!
<script>
var obj = null;
function hilight() {
var e=window.event.srcElement;
e=e.parentElement;
if(e.tagName!="TR") return;
if(obj!=null) obj.runtimeStyle.backgroundColor="";
obj=e;
obj.runtimeStyle.backgroundColor="#FFE28C";
}
</script><table border=1>
<tr onclick='hilight();'>
<td>aa</td>
</tr>
<tr onclick='hilight();'>
<td>bb</td>
</tr>
<tr onclick='hilight();'>
<td>cc</td>
</tr>
</table>