Jquery移動更改頁面

Question

我有一個網站的網頁布局， http：//jquerymobile.com/demos/1.0.1/

現在，他們已經使用<a href="#xxx" data-role="button">Sample</a>提供了<a href="#xxx" data-role="button">Sample</a>條款

但我的問題是如何使用代碼以編程方式更改頁面。

$.mobile.changePage("#xxx"); 不適合我

Answer 1

這是一個非常簡單的例子： http ： //jsfiddle.net/shanabus/YjsPD/

$.mobile.changePage("#page2");

文檔： http ： //api.jquerymobile.com/jQuery.mobile.changePage/

其他例子：

//transition to the "about us" page with a slideup transition
$.mobile.changePage( "about/us.html", { transition: "slideup"} );

//transition to the "search results" page, using data from a form with an ID of "search""   
$.mobile.changePage( "searchresults.php", {
    type: "post",
    data: $("form#search").serialize()
});

//transition to the "confirm" page with a "pop" transition without tracking it in history   
$.mobile.changePage( "../alerts/confirm.html", {
    transition: "pop",
    reverse: false,
    changeHash: false
});

UPDATE

正如Chase Roberts在下面的評論中指出的那樣，這個changePage方法在1.4版中已被棄用。 這是新的pagecontainer更改事件的文檔。

例：

$.mobile.pageContainer.pagecontainer("change", "#page", { options });

在這個問題上也解決了這個問題： 如何在jQuery mobile（1.4 beta）中更改頁面？

Answer 2

我知道這已經得到了回答，但肯定正確答案為什么它不起作用的是語法不正確？

$ .mobile.changePage需要DOM對象（用於使用哈希語法在同一HTML文件中顯示頁面）而不僅僅是字符串。 所以給出的例子的正確語法是：

$.mobile.changePage($("#xxx"));

這應該是一種享受！

希望這可以幫助

Answer 3

$.mobile.changePage($("#page2")); 

是更正哪個div是可見頁面的正確方法。

如果你使用

$.mobile.changePage("#page2");

將重新加載DOM，並將觸發任何ondocumentready事件。

Answer 4

不，這是正確的語法$.mobile.changePage("#page2"); 或$.mobile.changePage( "about/us.html"); 看到Api

Answer 5

如果某些標記丟失，則首先檢查div塊的開始和結束標記bcoz，無法進行頁面轉換。 之后使用以下代碼

$.mobile.changePage("#page2");

Answer 6

function signin() {

    alert('singin button has been clicked');
    $.ajax({
        type: 'POST',
        url: 'http://localhost:8080/json/login',
        dataType: "json",
        headers: {'Authorization':'Basic '+ btoa('abc' + ':' + '12345')},
        contentType: 'application/json',
        data:loginFormToJSON(),
        success: function(data, textStatus, jqXHR)
        {
            if(data.token !="ErrorID-11000"){
                alert('login successfully');
                //document.location.href = "accountinfo.html";
                //document.getElementById("loginBtn").replace="accountinfo.html";
                $.mobile.changePage("accountinfo.html");
            }

            else{
                alert('userid password did not match');
            }
        },
        error: function(jqXHR, textStatus, errorThrown){
            alert('login error:'+errorThrown + textStatus);
        }
    });

}

從上面的代碼中，我在登錄頁面並成功登錄時轉到帳戶頁面，這與Jquery mobile 1.4一起使用。

希望有所幫助。