<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
window.onload=function(){
document.getElementById("btn_ID").onclick=function(){
/* alert("213");*/
//获取文本框的值
var nameValue=document.getElementById("userid").value;
var EValue=document.getElementById("EID").value;
var PhoneValue=document.getElementById("PhoenID").value;
// alert(EValue);
//获取td
var nameTD=document.createElement("td");
var nameText=document.createTextNode(nameValue);
nameTD.appendChild(nameText);
var ETD=document.createElement("td");
var EText=document.createTextNode(EValue);
ETD.appendChild(EText);
var PhoneTD=document.createElement("td");
var PhoneText=document.createTextNode(PhoneValue);
PhoneTD.appendChild(PhoneText);
var DelTD=document.createElement("td");
var aElement=document.createElement("a");
aElement.setAttribute("href","deleteEmp?id="+nameValue);
var DelText=document.createTextNode("删除");
aElement.appendChild(DelText);
DelTD.appendChild(aElement);
//增加tr 把td增加到tr上
var tr=document.createElement("tr");
tr.appendChild(nameTD);
tr.appendChild(ETD);
tr.appendChild(PhoneTD);
tr.appendChild(DelTD);
//吧tr增加到table上
var tableElement=document.getElementById("tableExample");
tableElement.appendChild(tr);
//删除
aElement.onclick=function(){
//使网页链接失效
return DelTr(aElement);
}
function DelTr(a){
var name= a.parentNode.parentNode.firstChild.firstChild.nodeValue;
//alert(name);
var flag=window.confirm("你真的要删除"+name+"这行么?");
if(!flag){
return false;
}
//获取tr的parent
var TrParent=aElement.parentNode.parentNode.parentNode;
//获取tr
var Tr=aElement.parentNode.parentNode;
//删除
TrParent.removeChild(tr);
//网页链接失效
return false;
}
}
}
</script>
</head>
<body>
添加用户:<br/>
用户名:<input type="text" name="user"id="userid"/>
Email:<input type="text" name="Ename" id="EID"value="qinxia@so.com"/>
电话:<input type="text" name="Phonename" id="PhoenID"/><br/>
<input type="button"value="提交"id="btn_ID"/>
<table border="1" id="tableExample">
<tr><td>用户名</td><td>Email</td><td>电话</td><td>删除</td></tr>
</table>
</body>
</html>
