為什么新建的無法刪除操作
? var a=document.createElement("a");
? ? ? ? ?a.innerHTML="刪除";
? ? ? ? ?a.href="javascript:;";
? ? ? ? ?a.onClick="del(this)";
? ? ? ? ?
? var a=document.createElement("a");
? ? ? ? ?a.innerHTML="刪除";
? ? ? ? ?a.href="javascript:;";
? ? ? ? ?a.onClick="del(this)";
? ? ? ? ?
2016-04-22
舉報
2016-04-25
我跟你同一天遇到的這個問題,時間上比你早一點點,然后一個問題玩到了現(xiàn)在o(╯□╰)o,好了,說重點
a.onClick="del(this)";這一行無效,無效原因下面說,我先說幾種有效的寫法:
a.onclick=function(){del(this);}
a.onclick=function(){del(a);}
a.onclick=function(){var deltr=this.parentNode.parentNode;deltr.parentNode.removeChild(deltr)};
然后說說無效這回事
首先,假如del是個不帶參的函數(shù),那么a.onclick=del;這種寫法有效,帶參就是上面那種帶function的
然后,上邊四種寫法都是a.onclick=方法名,就是將方法賦值給a的onclick事件,達(dá)到綁定事件作用,所以a.onClick="del(this)"至少應(yīng)該寫成a.onClick=del(this)
但是可惜的是a.onClick=del(this)也是錯的,這句話并不具有綁定事件作用,而是直接調(diào)用del(this),這不是我們要的
不過還有更可惜的,就是哪怕沒綁到onclick上,del(this)也沒有執(zhí)行,這是因為this指向調(diào)用者,沒有調(diào)用者時指向window,于是this.parentNode什么的undefined了,無法執(zhí)行。換成del(a)則至少可以執(zhí)行了。
最后說說a.onclick=del()與a.onclick=del
帶括號的是執(zhí)行函數(shù),返回值賦給onclick,結(jié)果就是,越過onclick先執(zhí)行了;不帶括號的是將函數(shù)綁定到onclick上,需要的時候再執(zhí)行。
如有錯誤,望指正。
2016-04-26
<!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(var?i=0;i<trs.length;i++){ ?????????????? ?????????????? ????????????????trs[i].onmouseover=function?color1(){this.style.backgroundColor="#f2f2f2";} ????????????????trs[i].onmouseout=function?color2(){this.style.backgroundColor="#fff";} ??????????} ?????????????? ?????//?鼠標(biāo)移動改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。 ?} ???? ????? ????? ??????//?編寫一個函數(shù),供添加按鈕調(diào)用,動態(tài)在表格的最后一行添加子節(jié)點; ?????function?addto(obj){ ?????????var?no=prompt("Your?No.:"); ?????????var?name=prompt("Your?Name:"); ????????? ?????????var?table=document.getElementById("table").lastChild; ????????? ?????????var?tr=document.createElement("tr"); ????????? ?????????var?td1=document.createElement("td"); ?????????td1.innerHTML=no; ????????? ?????????var?td2=document.createElement("td"); ?????????td2.innerHTML=name; ????????? ?????????var?td3=document.createElement("td"); ?????????//td3.innerHTML="<a?href="#">?刪除?</a>";? ?????????//td3.innerHTML="<a?href='javascript:;'?onclick='del(this)'?>刪除</a>"; ????????? ????????? ?????????var?a=document.createElement("a"); ?????????//a.innerHTML="<a?href="javascript:;"?onClick="del(this)">刪除</a>"; ?????????a.innerHTML="<a>刪除</a>" ?????????a.href="javascript:;"; ?????????a.onClick=function(){del(this);}; ????????? ?????????td3.appendChild(a); ????????? ?????????tr.appendChild(td1); ?????????tr.appendChild(td2); ?????????tr.appendChild(td3); ?????????table.appendChild(tr); ????????? ????????? ????????? ????????? ????????? ????????? ??????????var?trs=document.getElementsByTagName("tr"); ??????????for(var?i=0;i<trs.length;i++){ ?????????????? ?????????????? ????????????????trs[i].onmouseover=function?color1(){this.style.backgroundColor="#f2f2f2";} ????????????????trs[i].onmouseout=function?color2(){this.style.backgroundColor="#fff";} ??????????} ?????????????? ?????//?鼠標(biāo)移動改變背景,可以通過給每行綁定鼠標(biāo)移上事件和鼠標(biāo)移除事件來改變所在行背景色。 ????????? ????????? ?????} ????? ????? ????? ????? ???? ??? ? ?????//?創(chuàng)建刪除函數(shù) ?????function?del(obj){ ?????????var?del1=obj.parentNode.parentNode.parentNode; ?????????var?del2=obj.parentNode.parentNode; ?????????del1.removeChild(del2); ?????} ??</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:;"?onClick="del(this)">刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ???</tr> ???<tr> <td>xh002</td> <td>劉小芳</td> <td><a?href="javascript:;"?onClick="del(this)"?>刪除</a></td>???<!--在刪除按鈕上添加點擊事件??--> ???</tr>?? ???</table> ???<input?type="button"?value="添加一行"?onClick="addto(this)"??/>???<!--在添加按鈕上添加點擊事件??--> ?</body> </html>好像還是不行額
2016-04-22
我也遇到了這個問題