微調器未加載到外部鏈接中

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()加載外部頁面。有關該文檔的信息，它具有showLoadMsg選項，該選項“決定加載外部頁面時是否顯示加載消息”。

編輯：

這是加載我所描述的外部頁面的示例：

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

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