Title
.main{
width:500px;
margin:0auto;
}
td,th{
width:100px;
text-align:center;
}
#input{
width:350px;
}
#stu{
color:red;
}
functiondelRow(obj) {
$(obj).parent().parent().remove();
}
functionaddRow() {
varinput=$('#input').val();
vartab=document.getElementById("tab");
if(input==""){
$('#stu').html('輸入數(shù)據(jù)不能為空锨咙!')
return;
}
vararr=input.split(" ");
for(vari=0;i
if(arr[0] ==tab.rows[i].cells[0].innerHTML) {
$('#stu').html("該學(xué)號(hào)已存在批狱!");
return;
}
}
varrow=document.createElement("tr");
row.innerHTML=`${arr[0]}
${arr[1]}
${arr[2]}
`
$('#tab').append(row);
}
$(function(){
$("td").click(function(event){
//td中已經(jīng)有了input,則不需要響應(yīng)點(diǎn)擊事件
if($(this).children("input").length>0)
return false;
vartdObj=$(this);
varpreText=$(this).html();
//得到當(dāng)前文本內(nèi)容
varinputObj=$("");
//創(chuàng)建一個(gè)文本框元素
//? ? ? ? ? ? ? ? tdObj.html(""); //清空td中的所有元素
$(this).empty();
inputObj
.width($(this).width())
//設(shè)置文本框?qū)挾扰ctd相同
.height($(this).height())
.css({border:"0px",fontSize:"17px",font:"宋體"})
.val(preText)
.appendTo($(this))
//把創(chuàng)建的文本框插入到tdObj子節(jié)點(diǎn)的最后
.trigger("focus")
//用trigger方法觸發(fā)事件
.trigger("select");
inputObj.keyup(function(event){
if(13== event.which)
//用戶(hù)按下回車(chē)
{
vartext=$(this).val();
tdObj.html(text);
}
else if(27== event.which)
//ESC鍵
{
tdObj.html(preText);
}
});
//已進(jìn)入編輯狀態(tài)后输涕,不再處理click事件
inputObj.click(function(){
return false;
});
});
});
functionsearchRow() {
varid=$('#id').val();
vartab=document.getElementById("tab");
varname;
varstuClass;
for(vari=0;i
if(id==tab.rows[i].cells[0].innerHTML){
name=tab.rows[i].cells[1].innerHTML;
stuClass=tab.rows[i].cells[2].innerHTML;
varstr=`學(xué)號(hào):${id}
姓名:${name}
班級(jí):${stuClass}`;
$('#stu').html(str);
return;
}
}
$('#stu').html("該學(xué)號(hào)不存在");
}
學(xué)號(hào)
姓名
班級(jí)
操作
1001
岳華飛
計(jì)科
1002
阿飛
計(jì)科
1003
阿香
計(jì)科