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 相关文章推荐
12个非常有创意的JavaScript小游戏
Mar 18 Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 Javascript
js捕获鼠标滚轮事件代码
Dec 16 Javascript
javascript中expression的用法整理
May 13 Javascript
jQuery针对input的class属性写了多个值情况下的选择方法
Jun 03 Javascript
JavaScript 冒泡排序和选择排序的实现代码
Sep 03 Javascript
JS封装通过className获取元素的函数示例
Dec 20 Javascript
Node.JS 循环递归复制文件夹目录及其子文件夹下的所有文件
Sep 18 Javascript
对vue事件的延迟执行实例讲解
Aug 28 Javascript
详解无限滚动插件vue-infinite-scroll源码解析
May 12 Javascript
解析原来浏览器原生支持JS Base64编码解码
Aug 12 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
PHP下MAIL的另一解决方案
2006/10/09 PHP
PHP 数组基础知识小结
2010/08/20 PHP
PHP实现把文本中的URL转换为链接的auolink()函数分享
2014/07/29 PHP
PHP开启opcache提升代码性能
2015/04/26 PHP
PHP全局变量与超级全局变量区别分析
2016/04/01 PHP
PHP中的正则表达式实例详解
2017/04/25 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
laravel http 自定义公共验证和响应的方法
2019/09/29 PHP
laravel框架模型中非静态方法也能静态调用的原理分析
2019/11/23 PHP
JavaScript中的细节分析
2012/06/30 Javascript
THREE.JS入门教程(6)创建自己的全景图实现步骤
2013/01/25 Javascript
javascript页面加载完执行事件代码
2014/02/11 Javascript
jQuery中:not选择器用法实例
2014/12/30 Javascript
jquery 中toggle的2种用法详解(推荐)
2016/09/02 Javascript
使用FileReader API创建Vue文件阅读器组件
2018/04/03 Javascript
vue 实现一个简单的全局调用弹窗案例
2020/09/10 Javascript
[03:18]DOTA2亚洲邀请赛小组赛第一日 RECAP赛事回顾
2015/01/30 DOTA
Python定时执行之Timer用法示例
2015/05/27 Python
python执行scp命令拷贝文件及文件夹到远程主机的目录方法
2019/07/08 Python
简单了解python协程的相关知识
2019/08/31 Python
Python requests模块基础使用方法实例及高级应用(自动登陆,抓取网页源码)实例详解
2020/02/14 Python
django ObjectDoesNotExist 和 DoesNotExist的用法
2020/07/09 Python
Python matplotlib读取excel数据并用for循环画多个子图subplot操作
2020/07/14 Python
CSS3字体效果的设置方法小结
2016/06/13 HTML / CSS
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
2014/10/11 HTML / CSS
html5触摸事件判断滑动方向的实现
2018/06/05 HTML / CSS
英国最大的体育&时尚零售公司:JD Sports
2017/12/13 全球购物
Spartoo荷兰:鞋子、包包和服装
2018/07/12 全球购物
Viking Direct荷兰:购买办公用品
2019/06/20 全球购物
草莓网中国:StrawberryNet中国
2020/08/17 全球购物
Java提供了哪些企业应用编程接口
2015/02/13 面试题
财会专业大学生求职信
2014/09/26 职场文书
办公用品质量保证书
2015/05/11 职场文书
庆祝教师节主持词
2015/07/06 职场文书
python中pandas对多列进行分组统计的实现
2021/06/18 Python
关于MySQL临时表为什么可以重名的问题
2022/03/22 MySQL