求jquery获取table中的所有tr
本人刚学jquery,以前一直用mootools。现要对一个id为t1的table中的所有tr添加mouseenter和mouseout事件，我是这样弄的，但是有错误：
function HighLightTR(color,objId)
{
var trBgcolor;
var ArrTR = $(objId+" tr");
ArrTR.each(function(index,element){
element.mouseout(function(){
element.css('background-color','red');
});
element.mouseenter(function(){
element.css('background-color','blue');
});
});
return ArrTR;
}
[解决办法]
你看过jQuery的API没，如果没先去看看吧，有很多例子的
http://download.csdn.net/detail/p2227/3936926
另外你只给出函数是不全面的，相关的HTML也要有
最后，jQuery中根据ID获取DOM是$("#id")
[解决办法]
<!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> <title></title> <style type="text/css"> .odd{ background-color:Yellow; } .even{ background-color:Gray; } .tdGroup { background-color:Green; } .mouseOver{ background-color:Red; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function () { $.fn.ChangeOddEvenTrColor("tbodyList", "odd", "even", true, "pointer", "mouseOver"); $.fn.ChangeOddEvenTrColorWithGroup("tableList", "odd", "even", "tdGroup", false, true, "pointer", "mouseOver"); $.fn.ChangeOddEvenTrColorWithGroup("tableList2", "odd", "even", "tdGroup", false, false, "pointer", "mouseOver"); }); //===================================================================== //插件名称: ChangeOddEvenTrColor //作 者: yenange //功能说明: 设置奇偶行换色 //输入参数: 表格(table或tbody)id, 奇行class, 偶行class, 是否从第一行开始 //调用示例: $(function(){ $.fn.ChangeOddEvenTrColor("table1", "odd", "even", true,"pointer","mouseOver"); }); //输出参数: //创建日期: 2011-09-01 (function ($) { jQuery.fn.ChangeOddEvenTrColor = function (tabId, oddClass, evenClass, fromFirstTr, cursor, mouseOverClass) { var $obj = fromFirstTr ? $("#" + tabId + " tr") : $("#" + tabId + " tr").not(":first"); $obj.filter(":odd").addClass(oddClass).css("cursor", cursor); $obj.filter(":even").addClass(evenClass).css("cursor", cursor); if (typeof (mouseOverClass) != "undefined") { $($obj).each(function () { $(this).mouseover(function () { $(this).addClass(mouseOverClass); }).mouseout(function () { $(this).removeClass(mouseOverClass); }); }); } } })(jQuery); //===================================================================== //插件名称: ChangeOddEvenTrColorWithGroup //作 者: yenange //功能说明: 设置带分组的表格的奇偶行换色 //输入参数: 表格(table或tbody)id, 奇行class, 偶行class,合并单元格的class,是否从第一行开始， 分组是第一列， 指针名称， 鼠标移上样式(可选) //调用示例: $(function(){ $.fn.ChangeOddEvenTrColorWithGroup("tableList", "odd", "even", "tdGroup", false, true, "pointer", "mouseOver"); }); //输出参数: //创建日期: 2011-09-29 (function ($) { jQuery.fn.ChangeOddEvenTrColorWithGroup = function (tabId, oddClass, evenClass, groupClass, fromFirstTr, GroupIsFirstCol, cursor, mouseOverClass) { var $obj = fromFirstTr ? $("#" + tabId + " tr") : $("#" + tabId + " tr").not(":first"); var groupCol = GroupIsFirstCol ? "first" : "last"; var colNum = $obj.filter(":first").find("td").length; $obj.each(function (i) { if ($(this).find("td").length == colNum) { $(this).find("td").filter(":" + groupCol).addClass(groupClass) .siblings().addClass(i % 2 == 0 ? evenClass : oddClass).css("cursor", cursor); } else { $(this).find("td").addClass(i % 2 == 0 ? evenClass : oddClass).css("cursor", cursor); } }) if (typeof (mouseOverClass) != "undefined") { $obj.mouseover(function (i) { if ($(this).find("td").length == colNum) { $(this).find("td").filter(":" + groupCol).siblings().addClass(mouseOverClass); } else { $(this).find("td").addClass(mouseOverClass); } }).mouseout(function (i) { if ($(this).find("td").length == colNum) { $(this).find("td").filter(":" + groupCol).siblings().removeClass(mouseOverClass); } else { $(this).find("td").removeClass(mouseOverClass); } }); } } })(jQuery); </script> </head> <body> <table id="table1" cellpadding="2" cellspacing="1" border="1" style="width: 100%;"> <tr> <th>Class</th><th>Name</th><th>Age</th> </tr> <tbody id="tbodyList"> <tr> <td> A</td> <td> 叶子</td> <td> 1</td> </tr> <tr> <td> B</td> <td> 李子</td> <td> 2</td> </tr> <tr> <td> C</td> <td> 王子</td> <td> 3</td> </tr> <tr> <td> D</td> <td> 刘欢</td> <td> 4</td> </tr> </tbody> </table> <br /> <table id="tableList" cellpadding="2" cellspacing="1" border="1" style="width: 100%;"> <tr> <th>Class</th><th>Name</th><th>Age</th> </tr> <tr> <td rowspan="2"> A</td> <td> 叶子</td> <td> 1</td> </tr> <tr> <td> 李子</td> <td> 2</td> </tr> <tr> <td rowspan="3"> B</td> <td> 王子</td> <td> 3</td> </tr> <tr> <td> 刘欢</td> <td> 4</td> </tr> <tr> <td> 马云</td> <td> 5</td> </tr> <tr> <td> C</td> <td> 吴天</td> <td> 6</td> </tr> <tr> <td> D</td> <td> ？？</td> <td> 7</td> </tr> <tr> <td rowspan="2"> E</td> <td> 吕梁</td> <td> 8</td> </tr> <tr> <td> 淡雅</td> <td> 9</td> </tr> </table> <br /> <table id="tableList2" cellpadding="2" cellspacing="1" border="1" style="width: 100%;"> <tr> <th>Name</th><th>Age</th> <th>Class</th> </tr> <tr> <td> 叶子</td> <td> 1</td> <td rowspan="2"> A</td> </tr> <tr> <td> 李子</td> <td> 2</td> </tr> <tr> <td> 王子</td> <td> 3</td> <td rowspan="3"> B</td> </tr> <tr> <td> 刘欢</td> <td> 4</td> </tr> <tr> <td> 马云</td> <td> 5</td> </tr> <tr> <td> 吴天</td> <td> 6</td> <td> C</td> </tr> <tr> <td> ？？</td> <td> 7</td> <td> D</td> </tr> <tr> <td> 吕梁</td> <td> 8</td> <td rowspan="2"> E</td> </tr> <tr> <td> 淡雅</td> <td> 9</td> </tr> </table> </body> </html>
[解决办法]
$("#t1").find("tr").each(function(){
$(this).bind("mouseout mousedown",function(){
code
});
})