好资源导航 » 文章资讯 » Ajax实现表格中信息不刷新页面进行更新数据

Ajax实现表格中信息不刷新页面进行更新数据

2023-09-06 23:08:05 65

本文实例为大家分享了Ajax实现表格中的信息进行更新数据，供大家参考，具体内容如下

html:

css:控制单根边框

/*利用table和tr中的空隙来进行控制间隙的颜色*/
table{
border:0px;
background:#000;
}
tr{
background:#FFF;
}

js:

//在页面装载的时候进行对td的点击
$(document).ready(function(){
vartds=$("td");
tds.click(tdclick);
});
functiontdclick(){
//1将文本的内容保存起来
vartd=$(this);
vartext=td.text();
//2清空td里面的内容
td.html("");
//3建立文本框
varinput=$("");
//4.设置文本框的值是保存起来的值
input.attr("value",text);
//4.5相应回车和键盘事件
input.keyup(function(event){
//判断按键是什么
varmyevent=event||window.event;
varkey=myevent.keyCode;
if(key==13){
varinputnode=$(this);
//1.保存文本框的内荣
varinputtext=inputnode.val();
//2.清空td里面的内容保存的文本框填充到td中去
vartdNode=inputnode.parent();
tdNode.html(inputtext);
//4.让td重新拥有点击事件
td.click(tdclick);
}
});
//5将文本框加入到td中
td.append(input);
//6为了防止td的点击事件，我们可以移除
td.unbind("click");
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

1111	2222
3333	4444

Ajax实现表格中信息不刷新页面进行更新数据

热门推荐

随机推荐