Question

我正在开发一个我有内部和外部链接的应用程序。我注意到单击外部链接时Jquery mobile没有加载微调器：

实施例

<a href = "/products">Spinner is shown </a>

<a href = "othersite.com" rel = "external">Spinner is NOT shown </a>

我试过了：

$('a[href][rel=external]').click(function(){  //doesnt work
     $.mobile.showPageLoadingMsg();

 }

和

$('a[href][rel=external]').click(function(){
// shows the spinner but it gets stuck forever
     $.mobile.showPageLoadingMsg();

    $('#loadingDiv').div("refresh");


}

有人可以帮我在点击rel =外部链接时显示微调器吗？

Answer 1

http://jquerymobile.com/test/docs/pages/page-links.html

指向其他域或具有rel =“external”的链接， data-ajax =“false”或目标属性不会被Ajax加载。相反，这些链接将导致整页刷新而没有动画过渡。两个属性（rel =“external”和data-ajax =“false”）具有相同的效果，但具有不同的语义含义：rel =“external” 应该在链接到另一个站点或域时使用 data-ajax =“false”对于简单地选择你的页面非常有用通过Ajax加载域。由于安全限制，框架总是选择从Ajax中链接到外部域行为。

你不会得到一个加载微调器，因为它只是要进行页面重定向。此外，对于您的jsfiddle，google.com将无法正常工作，因为他们不允许iframe访问。如果您将其更改为其他网站，例如http://jsfiddle.net，则会正确切换网站。

如果你必须显示微调器，你可以做这样的事情

http://jsfiddle.net/RqkYM/10/

$('a[href][rel=external]').click(function(e){
    e.preventDefault();
    e.stopPropagation();
     $.mobile.showPageLoadingMsg();
    window.location = $(this).attr('href');

});

它将显示微调器然后执行重定向

Answer 2

如果需要，可以使用$.mobile.changePage()加载外部页面。here for docs 它有一个showLoadMsg选项，“决定在加载外部页面时是否显示加载消息。”

编辑：

以下是加载外部页面的示例，如我所描述的：

http://jsfiddle.net/KYvDv/2/

$.mobile.changePage( "/gQxCN/1/show/", {
    showLoadMsg: true
});

Spinner没有加载外部链接

2 个答案: