2013-08-27 42 views
9

我们使用Bootstrap Modal window来显示一些通过远程源加载的html。我们通过Bootstrap文档中的推荐方式执行此操作,方法是使用选项remote并将其传递给url。 (如上所述hereBootstrap模态远程源错误处理

例如:

$('#id').modal({remote:'index.html'}); 

我的问题:是否有可能处理错误在index.html的不可用的情况?

我在文档中看不到任何答案。

我知道这应该很少发生,但是如果有人有一个缓慢或多斑点的连接,我宁愿向他们显示一个错误,而不是挂在一个空的模态。

+1

我给了一个1 +,但我也要去补充一点看起来单个文件在其他文件不存在的情况下会变得很糟糕的可能性很小 - 换句话说,假设这个资源是从同一个服务器/域加载的,那么您的应用/页面在其他方面可能会有问题情况。 –

+1

谢谢!是的我同意。我们在移动设备上特别注意到这个问题 - 由于显而易见的原因,可能会导致连接丢失,因为覆盖并不总是完美。当发生这种情况时,我们的整个应用程序被冻结,因为它没有任何条件(据我所知)的错误/超时。你只需要覆盖页面的黑色背景 - 直到你进行硬重置。 – nostromo

回答

5

您可能希望实现全球的Ajax错误处理您的应用程序,这将附加到每次执行Ajax请求,执行将是这个样子:

$(document).ajaxError(function(event, jqxhr, settings, exception) { 
    //Since this handler is attach to all ajax requests we can differentiate by the settings used to build the request 
    if (settings.url == "index.html") { 
    //Handle error 
    } 
}); 

你可以阅读更多关于全球的Ajax处理程序here

+0

哦,快点!伟大的一点。 –

3

目前GitHub库(/js/modal.js)包含在模态插件定义该片段:

… 
if (this.options.remote) this.$element.load(this.options.remote) 
… 

这表明没有回调时,该请求的结果被直接分配到的DOM元素正在处理。

从文档jQuery.load

这种方法是从服务器获取数据的最简单方法。它是 大致相当于$ .get(url,data,success),只是它是一个 方法而不是全局函数,并且它有一个隐式回调函数 。当检测到成功响应时(即当textStatus 为“成功”或“未修改”时),.load()将匹配元素的HTML内容设置为返回的数据。

在doc后来有介绍如何检测故障与load代码snippt:

$("#success").load("/not-here.php", function(response, status, xhr) { 
    if (status == "error") { 
    var msg = "Sorry but there was an error: "; 
    $("#error").html(msg + xhr.status + " " + xhr.statusText); 
    } 
}); 

看来Twitter的团队选择了处理错误。

也许是时候开始的问题,这似乎是一个“移动第一”的图书馆将要处理这种事情摆好;-) https://github.com/twbs/bootstrap/issues