Ajax 加载面板适用于 FF,但不适用于 Chrome。知道为啥吗?
Posted
技术标签:
【中文标题】Ajax 加载面板适用于 FF,但不适用于 Chrome。知道为啥吗?【英文标题】:Ajax loading panel works on FF but doesn't work on Chrome. Any idea why?Ajax 加载面板适用于 FF,但不适用于 Chrome。知道为什么吗? 【发布时间】:2013-08-13 03:59:18 【问题描述】:我正在使用这个 ajax 加载面板http://thisiscontext.com/tools/jQuery-showLoading
我有以下代码:
jQuery('#map').showLoading();
var request = OpenLayers.Request.POST(
url: "service.asmx/DeleteStopPoint",
data: "'TripId':'" + currentTrip + "','PointId':'" + feature.attributes.PointId + "'",
async: false,
headers: "Content-Type": "application/json; charset=utf-8" ,
callback: refreshMap
);
jQuery('#map').hideLoading();
发生的情况是,在 FF 中,我确实看到加载面板在发出请求之前出现并在其结束后隐藏......但在 chrome 中它不会发生。看起来面板出现并立即消失(因为如果我注释掉 hideLoading 功能,它会出现在 POST 之后)
知道为什么吗?
【问题讨论】:
我建议不要使用 sjax(非异步 ajax) 我应该怎么做? 【参考方案1】:不是使用同步请求,而是执行普通(异步)请求并在 ajax 回调中隐藏地图。也不要手动构建 JSON,你所拥有的实际上不是有效的 JSON,你应该使用 JSON.stringify
代替。
jQuery('#map').showLoading();
var request = OpenLayers.Request.POST(
url: "service.asmx/DeleteStopPoint",
data: JSON.stringify( TripId: currentTrip, PointId: feature.attributes.PointId ),
/* async: false, <-- don't do that*/
headers: "Content-Type": "application/json; charset=utf-8" ,
callback: refreshMap
);
function refreshMap(some, arguments0
...
jQuery('#map').hideLoading();
【讨论】:
以上是关于Ajax 加载面板适用于 FF,但不适用于 Chrome。知道为啥吗?的主要内容,如果未能解决你的问题,请参考以下文章
Box-Shadow 适用于 Chrome,但不适用于 Firefox 或 IE