javascript - 404 和 500 上的 JQuery Mobile “Error Loading Page”

Question

我希望 jQuery Mobile 导航到标记有 500 或 404 的页面。有没有办法让 jqm 知道这些页面可以导航到？我见过使用 $( document ).bind( "pageloadfailed") 重定向到 404 页面的其他解决方案，但我不想这样做。我只想显示由我的 PHP 应用程序生成的 404\500 页面。谢谢。

Answer 1

jQuery Mobile 知道 HTTP 状态代码 404 和 500 是错误代码，因此会自动执行其默认错误行为，除非您明确告诉它不这样做。 jQuery Mobile docs关于 pageloadfailed 事件的状态:

By default, after dispatching this event, the framework will display a page failed message and call reject() on the deferred object contained within the event's data object. Callbacks can prevent this default behavior from executing by calling preventDefault() on the event.

所以...默认行为是劫持您的请求并显示其自己的“页面失败消息”。 唯一获得除默认行为之外的东西的方法是覆盖默认设置。您确实必须为 pageloadfailed 事件编写事件处理程序，但您不必重定向到不同的 404 页面，您可以只使用返回的 HTML从你的应用程序。您可以使用恰当命名的方法 preventDefault() 来停止默认行为。这告诉 jQuery 您将自己处理错误 - 在这里您可以简单地传递您的应用程序返回以显示的 HTML。同样，来自文档:

Callbacks that call preventDefault() on the event, MUST call resolve() or reject() on this object so that changePage() requests resume processing.

这是调用 resolve() 的代码，因此您可以传入要显示的 HTML:

$( document ).bind( "pageloadfailed", function( event, data ) {

    // Let the framework know we're going to handle things.
    event.preventDefault();

    // at some point, either in this callback, or through
    // some other async means, call resolve, passing in
    // the following args, plus a jQuery collection object
    // containing the DOM element for the page.

    // Extract the HTML response from the Ajax request
    var page = data.xhr.responseText;

    data.deferred.resolve( data.absUrl, data.options, page );

});