为了账号安全,请及时绑定邮箱和手机立即绑定

为啥我写的这个js,三个功能都不好使呢,求高人细细指点一下

为啥我写的这个js,三个功能都不好使呢,求高人细细指点一下

doits 2016-03-25 21:38:13
<!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(){                       // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。         var trs=document.getElementsByTagName("tr");        for(i=1;i<trs.length;i++){         trs[i].onmouseover=function(){this.style.backgroundColor="#f2f2f2"};         trs[i].onmouseout=function(){this.style.backgroundColor="#fff"};        }        }           // 编写一个函数,供添加按钮调用,动态在表格的最后一行添加子节点;    function addto(){        var table=document.getElementsByTagName("table").lastChild;         var tr=document.createElement("tr");         var td=document.createElement("td");         tr.appendChild(td);         td=document.createElement("td");         tr.appendChild(td);         td=document.createElement("td");         tr.appendChild(td);         td.innerHTML="<a href="javascript:;" >删除</a>";         tr.appendChild(td);         table.appendChild(tr);     }          // 创建删除函数  function deleteItem(obj){        var table=document.getElementsById("table").lastChild;        var tr=obj.parentNode.parentNode;        table.removeChild(tr);     }       </script>  </head>  <body>    <table border="1" width="50%" id="table">   <tr> <th>学号</th> <th>姓名</th> <th>操作</th>   </tr>     <tr> <td>xh001</td> <td>王小明</td> <td><a href="javascript:;" >删除</a></td>   <!--在删除按钮上添加点击事件  -->   </tr>   <tr> <td>xh002</td> <td>刘小芳</td> <td><a href="javascript:;" >删除</a></td>   <!--在删除按钮上添加点击事件  -->   </tr>     </table>   <input type="button" value="添加一行" onclick="add()" />   <!--在添加按钮上添加点击事件  --> </body></html>
查看完整描述

2 回答

?
可爱的龟龟

TA贡献18条经验 获得超5个赞

你的问题肯定是动态添加的行鼠标移动时没有改变样式。

原因因为你动态添加的行没有绑定事件,到时候不响应。

在add方法中在执行一遍如下代码

function bindonmouseover(){
                  
     // 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
         var trs=document.getElementsByTagName("tr");
        for(i=1;i<trs.length;i++){
         trs[i].onmouseover=function(){this.style.backgroundColor="#f2f2f2"};
         trs[i].onmouseout=function(){this.style.backgroundColor="#fff"};
        }
     
 
}


查看完整回答
反对 回复 2016-03-26
  • 2 回答
  • 0 关注
  • 1406 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信