<!doctype html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>列表中被点击的行加高亮背景色</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <script type="text/javascript" src="../jquery-1.8.2.js"></script> <script type="text/javascript"> //点击某行后，高亮点中行的样式 function heightBrightTR(thisObj){ var thisTD = $(thisObj).parent(); //<a> 链接所在上层单元格td对象 var thisTR = thisTD.parent(); //<a> 链接所在上层行tr对象 thisTR.addClass('trBgStyle'); //添加背景高亮色 thisTR.siblings('tr').removeClass('trBgStyle'); //将同级同胞的背景色置空 } </script> <style type="text/css"> .trBgStyle{background:#ffff66;} /* 用于点击后改变行背景色 */ </style> </head> <body> <table border="1" width="100%" cellspacing="0" cellpadding="0"> <tr> <th>id号</th> <th>链接地址</th> </tr> <tr> <td>2</td> <td><a onclick="heightBrightTR(this)" target="_blank" href="http://www.google.com.hk">Google</a></td> </tr> <tr> <td>1</td> <td><a onclick="heightBrightTR(this)" target="_blank" href="http://www.baidu.com">百度</a></td> </tr> <tr> <td>4</td> <td><a onclick="heightBrightTR(this)" target="_blank" href="http://cn.msn.com">MSN中文网</a></td> </tr> </table> </body> </html>