使用AJAX技术即时修改数量(代码段)
这是一个可以通过点击商品数量,即时地修改其数量的AJAX代码段,供学习使用<span id="<%=p.getId()%>" style="background:red"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>
页:
[1]