SPAN标记中值的无刷新式修改（使用AJAX技术）

最新推荐文章于 2021-09-17 08:58:28 发布

fushengfei

最新推荐文章于 2021-09-17 08:58:28 发布

阅读量334

点赞数

分类专栏： Ajax 文章标签： Ajax JavaScript Microsoft JSP ViewUI

本文链接：https://blog.csdn.net/fushengfei/article/details/83724944

版权

Ajax 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

调用代码

<span id="1"  οnclick="changeToInput(this.id)" value="hello"> hello
</span>

javascript实现代码如下

		<script type="text/javascript">
			var req;
			var gID;
			function changeToInput(id) {//
				var oNP = document.getElementById(id);
				var value = oNP.value;
				oNP.outerHTML = "<input type='text' id='" + id + "' value='" + value + "' size='5' οnblur='change(this.id)'>";
				document.getElementById(id).focus();
			}
			
			function change(id) {
				var oNP = document.getElementById(id);
				var value = oNP.value;
				gID = id;
				init();
				var url = "ChangePrice.jsp?id=" + escape(id) + "&normalprice=" + value;
				req.open("GET", url, true);
				req.onreadystatechange = callback;
				req.send(null);
				
			}
			
			function init() {
				if(window.XMLHttpRequest) {
					req = new XMLHttpRequest();
				} else if (window.ActiveXObject) {
					req = new ActiveXObject("Microsoft.XMLHTTP");
				}
			}
			
			function callback() {
				if(4 == req.readyState) {
				
					if(200 == req.status) {
				
						var oNP = document.getElementById(gID);
						var value = oNP.value;
						oNP.outerHTML = "<span style='background:gray' id='" + gID + "' value='" + value + "' οnclick='changeToInput(this.id)'>" + value + "</span>";
					}
				}
				
			}
			
		</script>