JS 实现 ajax 异步浏览器兼容问题


Posted in Javascript onJanuary 21, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<td> 
<input type="button" value="订单详情" 
id="but<s:property value="#o.oid"/>" 
onclick="showDetail(<s:property value="#o.oid"/>)"/> 
<div id="div<s:property value="#o.oid"/>"></div> 
 </td> 
<script type="text/javascript"> 
function showDetail(oid){ 
var but = document.getElementById("but"+oid); 
var div1 = document.getElementById("div"+oid); 
if(but.value == "订单详情"){ 
// 1.创建异步对象 
var xhr = createXmlHttp(); 
// 2.设置监听 
xhr.onreadystatechange = function(){ 
if(xhr.readyState == 4){ 
if(xhr.status == 200){ 
div1.innerHTML = xhr.responseText; 
}} 
} 
// 3.打开连接 
xhr.open("GET", 
"${pageContext.request.contextPath}/ 
adminOrder_findOrderItem.action?oid="+oid+"&time= 
"+new Date().getTime(),true); 
// 4.发送 
xhr.send(null); 
but.value = "关闭"; 
}else{ 
div1.innerHTML = ""; 
but.value="订单详情"; 
} 
} 
function createXmlHttp(){ 
var xmlHttp; 
try{ // Firefox, Opera 8.0+, Safari 
xmlHttp=new XMLHttpRequest(); 
 } 
catch (e){ 
try{// Internet Explorer 
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); 
 } 
catch (e){ 
try{ 
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); 
} 
catch (e){} 
 } 
 } 
return xmlHttp; 
} 
</script> 
// 根据订单的id查询订单项: 
public String findOrderItem(){ 
// 根据订单id查询订单项: 
List<OrderItem> list = orderService.findOrderItem(order.getOid()); 
  // 显示到页面: 
ActionContext.getContext().getValueStack().set("list", list); 
  // 页面跳转 
return "findOrderItem"; 
}  
<table width="100%"> 
 <s:iterator var="orderItem" value="list"> 
 <tr> 
  <td><img width="40" height="45" src="${ pageContext.request.contextPath }/<s:property value="#orderItem.product.image"/>"></td> 
  <td><s:property value="#orderItem.product.pname"/></td> 
  <td><s:property value="#orderItem.count"/></td> 
  <td><s:property value="#orderItem.subtotal"/></td> 
 </tr> 
 </s:iterator> 
</table>

以上所述是小编给大家介绍的JS 实现 ajax 异步浏览器兼容问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
(function($){...})(jQuery)的意思
Jul 22 Javascript
写给想学习Javascript的朋友一点学习经验小结
Nov 23 Javascript
js获取当前日期时间及其它操作汇总
Apr 17 Javascript
javascript定义类和类的实现实例详解
Dec 01 Javascript
Node.js实用代码段之获取Buffer对象字节长度
Mar 17 Javascript
AngularJS 指令的交互详解及实例代码
Sep 14 Javascript
Vue中计算属性computed的示例解读
Jul 26 Javascript
利用nvm管理多个版本的node.js与npm详解
Nov 02 Javascript
vue将毫秒数转化为正常日期格式的实例
Sep 16 Javascript
js删除对象/数组中null、undefined、空对象及空数组方法示例
Nov 14 Javascript
jquery检测上传文件大小示例
Apr 26 jQuery
js实现盒子移动动画效果
Aug 09 Javascript
RequireJS 依赖关系的实例(推荐)
Jan 21 #Javascript
js操作浏览器的参数方法
Jan 21 #Javascript
JS实现图片高斯模糊切换效果的焦点图实例
Jan 21 #Javascript
js实现用户输入的小写字母自动转大写字母的方法
Jan 21 #Javascript
jQuery点击弹出层弹出模态框点击模态框消失代码分享
Jan 21 #Javascript
利用transition实现文字上下抖动的效果
Jan 21 #Javascript
jQuery Ajax实现跨域请求
Jan 21 #Javascript
You might like
Smarty日期时间操作方法示例
2016/11/15 PHP
BOOM vs RR BO5 第四场 2.14
2021/03/10 DOTA
Add a Table to a Word Document
2007/06/15 Javascript
ExtJs grid行 右键菜单的两种方法
2010/06/19 Javascript
Javascript和HTML5利用canvas构建Web五子棋游戏实现算法
2013/07/17 Javascript
JS连接SQL数据库与ACCESS数据库的方法实例
2013/11/21 Javascript
jQuery操作DOM之获取表单控件的值
2015/01/23 Javascript
JQuery实现展开关闭层的方法
2015/02/17 Javascript
完美解决spring websocket自动断开连接再创建引发的问题
2017/03/02 Javascript
js实现一个猜数字游戏
2017/03/31 Javascript
js模拟支付宝密码输入框
2017/04/11 Javascript
JS 学习总结之正则表达式的懒惰性和贪婪性
2017/07/03 Javascript
JS库之Particles.js中文开发手册及参数详解
2017/09/13 Javascript
利用ES6实现单例模式及其应用详解
2017/12/09 Javascript
JS+canvas画一个圆锥实例代码
2017/12/13 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
2018/04/26 Javascript
bootstrap模态框关闭后清除模态框的数据方法
2018/08/10 Javascript
Vue 实现列表动态添加和删除的两种方法小结
2018/09/07 Javascript
JS匿名函数内部this指向问题详析
2019/05/10 Javascript
Vue formData实现图片上传
2019/08/20 Javascript
详解vue-video-player使用心得(兼容m3u8)
2019/08/23 Javascript
vue 授权获取微信openId操作
2020/11/13 Javascript
Python删除windows垃圾文件的方法
2015/07/14 Python
python简单分割文件的方法
2015/07/30 Python
python3对拉勾数据进行可视化分析的方法详解
2019/04/03 Python
python MultipartEncoder传输zip文件实例
2020/04/07 Python
Python定时任务APScheduler安装及使用解析
2020/08/07 Python
Python爬虫定时计划任务的几种常见方法(推荐)
2021/01/15 Python
CheapTickets香港机票预订网站:CheapTickets.hk
2019/06/26 全球购物
Emma Bridgewater官网:英国餐具制造商
2019/11/24 全球购物
JAVA的事件委托机制和垃圾回收机制
2014/09/07 面试题
秘书行业自我鉴定范文
2013/12/30 职场文书
安全生产月宣传标语
2014/10/06 职场文书
自动在Windows中运行Python脚本并定时触发功能实现
2021/09/04 Python
Springboot如何同时装配两个相同类型数据库
2021/11/17 Java/Android
解析探秘fescar分布式事务实现原理
2022/02/28 Java/Android