Страница изменения мобильного Jquery

Question

У меня есть две колонки для веб-страницы с сайта, http://jquerymobile.com/demos/1.0.1/

Теперь они предоставили условия для изменения страницы, используя <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
});

ОБНОВЛЕНИЕ

Как отмечает Чейз Робертс в комментариях ниже, этот метод changePage устарел в версии 1.4.Вот документация для нового события pagecontainer .

Пример:

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

Этот вопрос также был рассмотрен по этому вопросу SO: Как изменить страницув мобильном jQuery (1.4 бета)?

Answer 2

Я знаю, что на этот вопрос уже был дан ответ, но наверняка правильный ответ, почему он не работает, заключается в том, что синтаксис неверен?

$. Mobile.changePage требует объект DOM (для отображения страниц в том жеHTML-файл с использованием синтаксиса хеша), а не просто строка.Таким образом, правильный синтаксис для приведенного примера будет таким:

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

Это должно сработать!

Надеюсь, это поможет

Answer 3

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

- это правильный способ изменить, какой div является видимой страницей.

Если вы используете

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

DOM будет перезагружен, и любые события ondocumentready будут вызваны.

Answer 4

Сначала вы проверяете начальный и конечный тег блока div bcoz, если какой-либо тег отсутствует, переход на страницу невозможен. После этого используйте следующий код

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

Answer 5

Нет, это правильный синтаксис $.mobile.changePage("#page2"); или $.mobile.changePage( "about/us.html"); см. API

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.

Надеюсь, это поможет.