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 相关文章推荐
模仿JQuery.extend函数扩展自己对象的js代码
Dec 09 Javascript
node在两个div之间移动,用ztree实现
Mar 06 Javascript
jQuery Ajax异步处理Json数据详解
Nov 05 Javascript
原生JS可拖动弹窗效果实例代码
Nov 09 Javascript
JS中如何设置readOnly的值
Dec 25 Javascript
Ext JS框架程序中阻止键盘触发回退或者刷新页面的代码分享
Jun 07 Javascript
jQuery获取同级元素的简单代码
Jul 09 Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 Javascript
angular.extend方法的具体使用
Sep 14 Javascript
JS实现简单的抽奖转盘效果示例
Feb 16 Javascript
详解JavaScript 异步编程
Jul 13 Javascript
JS实现选项卡插件的两种写法(jQuery和class)
Dec 30 jQuery
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创建动态图像
2006/10/09 PHP
php结合web uploader插件实现分片上传文件
2016/05/10 PHP
PHP合并数组的2种方法小结
2016/11/24 PHP
laravel 中如何使用ajax和vue总结
2017/08/16 PHP
PHP实现的简单对称加密与解密方法实例小结
2017/08/28 PHP
使用jQuery清空file文件域的解决方案
2013/04/12 Javascript
jQuery中:last选择器用法实例
2014/12/30 Javascript
JavaScript中常用的六种互动方法示例
2015/03/13 Javascript
对JavaScript的全文搜索实现相关度评分的功能的方法
2015/06/24 Javascript
javascript实现状态栏文字首尾相接循环滚动的方法
2015/07/22 Javascript
jQuery实现的简单提示信息插件
2015/12/08 Javascript
Vue.js每天必学之方法与事件处理器
2016/09/06 Javascript
React快速入门教程
2017/01/17 Javascript
简单实现js选项卡切换效果
2017/02/09 Javascript
Bootstrap Table 在指定列中添加下拉框控件并获取所选值
2017/07/31 Javascript
get  post jsonp三种数据交互形式实例详解
2017/08/25 Javascript
Chrome调试折腾记之JS断点调试技巧
2017/09/11 Javascript
vue 引入公共css文件的简单方法(推荐)
2018/01/20 Javascript
在vue项目中正确使用iconfont的方法
2018/09/28 Javascript
js实现随机点名程序
2020/09/17 Javascript
vue-cli3单页构建大型项目方案
2020/04/07 Javascript
玩转python爬虫之cookie使用方法
2016/02/17 Python
python中实现迭代器(iterator)的方法示例
2017/01/19 Python
深入理解Django中内置的用户认证
2017/10/06 Python
Python中文件的读取和写入操作
2018/04/27 Python
python TKinter获取文本框内容的方法
2018/10/11 Python
pandas 透视表中文字段排序方法
2018/11/16 Python
python3 反射的四种基本方法解析
2019/08/26 Python
基于Django OneToOneField和ForeignKey的区别详解
2020/03/30 Python
Django模板标签{% for %}循环,获取制定条数据实例
2020/05/14 Python
python切割图片的示例
2020/11/12 Python
什么是smarty? Smarty的优点是什么?
2013/08/11 面试题
老师给学生的表扬信
2014/01/17 职场文书
2016中秋节广告语
2016/01/28 职场文书
创业计划书之农家乐
2019/10/09 职场文书
CSS filter 有什么神奇用途
2021/05/25 HTML / CSS