js添加onmouseover/out無效?
<!DOCTYPE?html> <html> <head> ????<title>?new?document?</title> ????<meta?http-equiv="Content-Type"?content="text/html;?charset=gbk"/> ????<script?type="text/javascript"> ????????window.onload?=?function(){ ????????????//?鼠標(biāo)移動改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。 ????????????var?trNodeList?=?document.getElementsByTagName("tr"); ????????????for?(var?i=0;?i<trNodeList.length;?i++){ ????????????????trNodeList[i].onmouseout?=?resetColor(trNodeList[i]); ????????????} ????????????for?(var?i=0;?i<trNodeList.length;?i++){ ????????????????trNodeList[i].onmouseover?=?changeColor(trNodeList[i]); ????????????} ????????} ????????function?resetColor(obj)?{ ????????????obj.style.backgroundColor?=?"gray"; ????????} ????????function?changeColor(obj)?{ ????????????obj.style.backgroundColor="red"; ????????} // //????????window.onload?=?function(){ //????????????var?tr=document.getElementsByTagName("tr"); //????????????for(var?i=?0;i<tr.length;i++) //????????????{ //????????????????bgcChange(tr[i]); //????????????} //????????????//?鼠標(biāo)移動改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。 //????????} //????????function?bgcChange(obj) //????????{ //????????????obj.onmouseover=function(){ //????????????????obj.style.backgroundColor="#f2f2f2"; //????????????} //????????????obj.onmouseout=function(){ //????????????????obj.style.backgroundColor="#fff"; //????????????} //????????} ????????//?編寫一個函數(shù),供添加按鈕調(diào)用,動態(tài)在表格的最后一行添加子節(jié)點; ????????function??addStudent()?{ ????????????var?table??=?document.getElementsByTagName("table")[0]; ????????????var?newTr?=?document.createElement("tr"); ????????????var?newTd1?=?document.createElement("td"); ????????????var?newTd2?=?document.createElement("td"); ????????????var?newTd3?=?document.createElement("td"); ????????????var?newA?=?document.createElement("a"); ????????????newA.setAttribute("href",?"javascript:(this);"); ????????????newA.setAttribute("onclick",?"deleteTr(this)"); ????????????newA.innerHTML?=?"delete"; ????????????newTd3.appendChild(newA); ????????????newTr.appendChild(newTd1); ????????????newTr.appendChild(newTd2); ????????????newTr.appendChild(newTd3); ????????????table.appendChild(newTr); ????????} ????????//?創(chuàng)建刪除函數(shù) ????????function?deleteTr(obj)?{ ????????????var?tr?=?obj.parentNode.parentNode; ????????????var?ta?=?tr.parentNode; ????????????ta.removeChild(tr); ????????????tr=?null; ????????} ????</script> </head> <body> <table?border="1"?width="50%"?id="table"> ????<tr> ????????<th>學(xué)號</th> ????????<th>姓名</th> ????????<th>操作</th> ????</tr> ????<tr> ????????<td>xh001</td> ????????<td>王小明</td> ????????<td><a?href="javascript:deleteTr(this);"?onclick="deleteTr(this)">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ????</tr> ????<tr> ????????<td>xh002</td> ????????<td>劉小芳</td> ????????<td><a?href="javascript:deleteTr(this);"?onclick="deleteTr(this)"?>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ????</tr> </table> <input?type="button"?value="添加一行"??onclick="addStudent()"/>???<!--在添加按鈕上添加點擊事件??--> </body> </html>
這里的為什么是無效的,該怎么改呢?
2017-04-07
trNodeList[i].onmouseout?=?resetColor(trNodeList[i]);
這樣寫是不對的。應(yīng)該是:
trNodeList[i].onmouseout?= function(){resetColor(trNodeList[i])};
2017-04-24
解決了,變量作用域的問題
2017-04-08
這里顯示參數(shù)沒傳進(jìn)去吶