JS 實現(xiàn) ajax 異步瀏覽器兼容問題
更新時間:2017年01月21日 09:36:05 作者:mine_song
本文通過實例代碼給大家講解了js實現(xiàn)ajax異步瀏覽器兼容問題,代碼簡單易懂,非常不錯,具有參考借鑒價值,需要的朋友參考下吧
廢話不多說了,直接給大家貼代碼了,具體代碼如下所示:
<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.創(chuàng)建異步對象
var xhr = createXmlHttp();
// 2.設置監(jiān)聽
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.發(fā)送
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 實現(xiàn) ajax 異步瀏覽器兼容問題,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!
相關文章
JavaScript switch case 的用法實例[范圍]
JavaScript switch case 的用法實例,大家可以參考下。2009-09-09
JavaScript隊列函數(shù)和異步執(zhí)行詳解
這篇文章主要為大家詳細介紹了JavaScript隊列函數(shù)和異步執(zhí)行的相關資料,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-06-06
關于innerHTML后丟失動態(tài)綁定的EVENT問題解決方法
用innerHTML取出一段內容后再innerHTML回去,那么原來動態(tài)綁定的事件就會丟失,下面與大家分享下解決方法,感興趣的朋友可以參考下哈2013-05-05

