Ajax实现表格中信息不刷新页面进行更新数据
本文实例为大家分享了Ajax实现表格中的信息进行更新数据，供大家参考，具体内容如下
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" src="jslib/jquery-3.1.1.js"></script>
<script type="text/javascript" src="jslib/edit.js"></script>
<link type="text/css" href="css/edit.css" rel="external nofollow" rel="stylesheet"></head>
</head>
<body>
<table>
<tbody>
<tr>
<td>1111</td>
<td>2222</td>
</tr>
<tr>
<td>3333</td>
<td>4444</td>
</tr>
</tbody>
</table>
</body>
</html>
css:控制单根边框
/*利用table和tr中的空隙来进行控制间隙的颜色*/
table{
border: 0px;
background: #000;
}
tr{
background: #FFF;
}
js:
//在页面装载的时候进行对td的点击
$(document).ready(function () {
var tds = $("td");
tds.click(tdclick);
});
function tdclick() {
//1将文本的内容保存起来
var td = $(this);
var text = td.text();
//2清空td里面的内容
td.html("");
//3建立文本框
var input = $("<input>");
//4.设置文本框的值是保存起来的值
input.attr("value", text);
//4.5相应回车和键盘事件
input.keyup(function (event) {
//判断按键是什么
var myevent = event || window.event;
var key = myevent.keyCode;
if (key == 13) {
var inputnode = $(this);
//1.保存文本框的内荣
var inputtext = inputnode.val();
//2.清空td里面的内容保存的文本框填充到td中去
var tdNode = inputnode.parent();
tdNode.html(inputtext);
//4.让td重新拥有点击事件
td.click(tdclick);
}
});
//5将文本框加入到td中
td.append(input);
//6为了防止td的点击事件，我们可以移除
td.unbind("click");
}
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持小牛知识库。
-
本文向大家介绍Ajax+FormData+javascript实现无刷新表单信息提交，包括了Ajax+FormData+javascript实现无刷新表单信息提交的使用技巧和注意事项，需要的朋友参考一下 原理： dom收集表单信息，利用FormData快速收集表单信息 ，实例化表单数据对象 同时收集fm的表单域信息。 alert(fd); fd对象内部有收集的form表单域信息 ajax传递表单信
-
问题内容： 我的表单类似于以下内容： 我是AJAX的新手，我要完成的工作是当用户单击“提交”按钮时，我希望脚本在后台运行而不刷新页面。 我尝试了类似下面的代码的方法，但是，它似乎仍然像以前一样提交表单，而不像我所需要的那样（在幕后）： 如果可能的话，我想获得使用AJAX实施此功能的帮助， 提前谢谢了 问题答案： 您需要阻止默认操作（实际提交）。
-
本文向大家介绍php+ajax实现无刷新分页，包括了php+ajax实现无刷新分页的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了php+ajax实现无刷新分页实现方法。分享给大家供大家参考。具体如下： limit 偏移量，长度; limit 0,7; 第一页 limit 7,7; 第二页 limit 14,7; 第三页 每页信息条数：7
-
本文向大家介绍利用AJAX实现无刷新数据分页，包括了利用AJAX实现无刷新数据分页的使用技巧和注意事项，需要的朋友参考一下 以前在使用Asp.Net的时候用过GridView这个控件，这个控件自带分页的功能，虽然很丑，但是功能还是很强大的。这里呢，给大家展示一下更加给力的方式——利用AJAX无刷新直接从服务器获取数据分页。 一、实现过程 注意：一下的内容都是在服务器内使用的。 首先要在服务器的路径
-
本文向大家介绍pushState、replaceState、onpopstate 实现Ajax页面的前进后退刷新，包括了pushState、replaceState、onpopstate 实现Ajax页面的前进后退刷新的使用技巧和注意事项，需要的朋友参考一下 使用Ajax可以异步获取数据，可以更高效地渲染页面。 但也存在这一些问题： 再刷新页面，页面就会变成初始的状态 浏览器的前进后退功能无效 对
-
本文向大家介绍django+js+ajax实现刷新页面的方法，包括了django+js+ajax实现刷新页面的方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了django+js+ajax实现刷新页面的方法。分享给大家供大家参考，具体如下： 在服务器开发的时候，为了方便将服务器对外开一个接口来操作，可以使用django制作网页，通过页面来操作服务器。这样可以将服务器的维护工作暴漏在更加友