鼠標移動改變背景對新增加的行不起作用要怎么改呢
? <script type="text/javascript">?
??
? ? ? window.onload = function(){
? ? ? ? ?var tr=document.getElementsByTagName('tr');//獲取TR數組 ?
? ? ? ? ?for (var i=0;i<tr.length;i++)
? ? ? ? ?{
? ? ? ? ? ? ?change(tr[i]);
? ? ? ? ?}
? ? ?// 鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
? ? ? ? ?function change(obj)
? ? ? ? ?{
? ? ? ? ? ? ?obj.onmouseover=function(){
? ? ? ? ? ? ? ? obj.style.background='#ccc';
? ? ? ? ? ? ?}
? ? ? ? ? ? ?obj.onmouseout=function(){
? ? ? ? ? ? ? ? ?obj.style.background='#fff'
? ? ? ? ? ? ?}
? ? ? ? ?}
? ? ?
?
}
? ? ?
? ? ? // 編寫一個函數,供添加按鈕調用,動態在表格的最后一行添加子節點;
? ? ? var nob=2;
? ? ?function add()
? ? ?{
? ? ? ? ?nob++;
? ? ? ? ?if(nob<10)
? ? ? ? ?{nob='0'+nob;}
? ? ? ? ?var tab=document.getElementById('table');
? ? ? ? ?var addtr=document.createElement('tr');
? ? ? ? ?tab.appendChild(addtr);
? ? ? ? ?var addth1=document.createElement('td');
? ? ? ? ?addtr.appendChild(addth1);
? ? ? ? ?var addth2=document.createElement('td');
? ? ? ? ?addtr.appendChild(addth2);
? ? ? ? ?var addth3=document.createElement('td');
? ? ? ? ?addth3.innerHTML="<a href='javascript:;' ?onclick='deletetr(this)' >刪除</a>";
? ? ? ? ?addtr.appendChild(addth3);
? ? ? ? ??
? ? ? ? ?
? ? ? ? ?addth1.innerHTML='xh0'+nob;
? ? ? ? ?var name=prompt("請輸入座號為"+nob+'同學的座號',"")
? ? ? ? ? ? if (name!=null && name!="")
? ? ? ? ? ? ? ? {
? ? ? ? ? ? ? ? addth2.innerHTML=name;
? ? ? ? ? ? ? ? }
? ? ? ??
? ? ?}
? ?
? ? ?
? ? ?// 創建刪除函數
? ? ?function deletetr(i)
? ? ?{
? ? ? ? ?var tr=i.parentNode.parentNode;
? ? ? ? ?tr.parentNode.removeChild(tr);
? ? ?}
? </script>?
2016-09-12
在add()函數的最后加上一句 window.onload(); 也可以
2016-09-12
新添加的行沒調用change()函數,在add()函數末尾加上:change(addtr);即可。
2016-09-12
因為新增加的行還沒調用change()函數,你在add()函數里的最后一行addtr.appendChild(addth3);的后面添加
var tr=document.getElementsByTagName('tr');//獲取TR數組 ?
? ? ? ? ?for (var i=0;i<tr.length;i++)
? ? ? ? ?{
? ? ? ? ? ? ?change(tr[i]);
? ? ? ? ?}
就行了
2016-09-12
對新加的對象重新綁定事件