`
bolovesang
  • 浏览: 16851 次
  • 性别: Icon_minigender_1
  • 来自: 宁波
社区版块
存档分类
最新评论

使用AJAX技术即时修改数量(代码段)

阅读更多

这是一个可以通过点击商品数量,即时地修改其数量的AJAX代码段,供学习使用

<span id="<%=p.getId()%>" style="background:red" onclick="changeToInput(this.id)" value="<%=p.getNormalPrice() %>">
							<%=p.getNormalPrice() %>
</span>

 

<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' onblur='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 + "' onclick='changeToInput(this.id)'>" + value + "</span>";
					}
				}
				
			}
			
		</script>

 

0
0
分享到:
评论

相关推荐

    基于ajax的即时通讯系统例子

    在本案例中,我们将探讨如何使用AJAX(Asynchronous JavaScript and XML)技术来构建一个基于Web的即时通讯系统。AJAX并非一种单一的技术,而是一种利用现有Web技术组合实现异步数据交换的方法,可以显著提升用户...

    ajax代码 ajax代码

    **Ajax(Asynchronous JavaScript and XML)技术是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新。这种技术可以提升用户体验,因为它...

    ajax 基础教程源代码

    ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础教程源代码ajax 基础...

    ajax即时聊天程序,无刷新聊天室程序

    **Ajax 即时聊天程序与无刷新聊天室技术详解** Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使得网页实现异步...

    基于Ajax的即时通讯系统

    **Ajax即时通讯系统详解** Ajax(Asynchronous JavaScript and XML)技术是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。在即时通讯系统中,Ajax发挥着至关重要的作用,它提高了用户体验,使得...

    AJax,java即时通讯 web qq

    【标题】"AJax,java即时通讯 web qq"揭示了一个基于Web技术实现的即时通讯系统,该系统利用Ajax和Java技术来模拟QQ的聊天功能。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,...

    Ajax技术实现代码和需要用的ajax的十个地方

    **Ajax** 文件可能是另一个与Ajax相关的资源,比如代码示例、教程文档或者案例研究,可以帮助我们深入理解和实践Ajax技术。 综上所述,Ajax技术通过DWR和Buffalo等框架在Web应用中发挥着重要作用,为用户提供无缝...

    利用ajax即时排序 asp代码

    【标题】"利用ajax即时排序 asp代码"涉及的核心技术主要为AJAX(Asynchronous JavaScript and XML)和ASP(Active Server Pages),这两种技术在Web开发中有着广泛的应用。本示例将阐述如何在ASP环境中利用AJAX实现...

    ajax无刷新来聊天代码

    根据提供的文件信息,...综上所述,通过上述知识点的梳理,我们可以了解到如何使用AJAX技术和JSP页面来构建一个简单的即时通讯系统的基本框架和技术要点。在实际开发过程中,还需要结合具体需求进一步完善功能细节。

    Ajax小实例,JSP环境下使用Ajax技术.rar

    收集的一些Ajax小实例,在JSP环境下使用Ajax技术。JSP是一比较高端的WEB前端技术,虽然入手不是太容易,不过代码规范度高,适用在一些安全性要求较高的场合,比如网银系统,在JSP下运用Ajax技术,已不是什么新鲜事了...

    ajax经典示例代码

    了解MySQL的用户可以直接使用自己熟悉的方式创建名为ajax的数据库,并将ajax.sql文件导入即可。 下面是简要操作方法: 1. 实例数据库在MySQL 5.0.27 版本下测试通过 2. 将database目录中ajax.sql文件复制到C:\ 3. ...

    《Ajax编程技术与实例》源代码

     全书内容由浅入深,充分考虑了Ajax学习者的特点,并在配套光盘中提供了书中实例的全部源代码,以方便读者能够举一反三,编写出适合需求的程序。  本书不仅适合Ajax技术的初学者,还能够帮助有一定编程...

    处理ajax返回的js代码

    标题 "处理ajax返回的js代码" 涉及的核心知识点是使用Ajax技术动态获取并执行JavaScript代码。Ajax(异步JavaScript和XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器交换...

    ajax的一些代码

    用于js和ajax的理解,用ajax实现不刷新整个页面用户体验良好

    AJAX编程技术与实例(java)源代码下载

    在这个“AJAX编程技术与实例(java)源代码”中,我们可以期待学习到以下关键知识点: 1. **XMLHttpRequest对象**:这是AJAX的核心,用于在后台与服务器通信。在JavaScript中创建XMLHttpRequest对象,然后利用它的...

    ajax测试使用实例,简单代码

    在这个"ajax测试使用实例,简单代码"中,我们将探讨如何利用Ajax进行基本的交互。 一、Ajax基础概念 Ajax的核心是JavaScript对象XMLHttpRequest,它允许JavaScript在后台与服务器通信。通过创建XMLHttpRequest对象...

    Ajax刷新 java Ajax 页面刷新

    Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。在Java中,我们可以利用Ajax实现页面的动态刷新,提高用户体验,因为它允许后台与服务器进行异步数据交换...

    ajax 学习笔记源代码

    ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习笔记源代码ajax 学习...

    深入浅出Ajax(Head Rush Ajax) 源码 书中代码

    书中提供的源码涵盖了这些章节中的实例和示例,读者可以通过实际运行和修改代码来加深对Ajax的理解。这些源码通常会包括: - 用JavaScript创建和管理XMLHttpRequest对象的脚本 - 处理各种HTTP请求和响应的函数 - ...

    ajax,java即时通讯web qq

    【Ajax与Java即时通讯在Web QQ中的应用】 Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使得网页实现异步更新,...

Global site tag (gtag.js) - Google Analytics