Question

嗯，这是我第一次使用jquery mobile。我正在尝试创建一个单页移动应用程序，我有两个div，如下所示：

<div data-role="page" id="divStart">
        <div data-role="content">
            <a id='btnShowSignUp' data-role="button" href='#' onclick="ShowSignUp();">Sign Up</a>
            <a id='btnShowSignUp' data-role="button" href='#' onclick="ShowLogin();">Login</a>
        </div>
</div>
<div data-role="page" id="divSignUp" style='display: none'>
        <div data-role="content">
            <form id='formSignUp' method='POST'>
                <div data-role="fieldcontain">
                    <label for="name">Name</label>
                    <input name="name" id="name" type="text">
                    <label for="email">E-mail</label>
                    <input name="email" id="email" type="text">
                    <label for="pass">Pass</label>
                    <input name="pass" id="pass" type="password">
                </div>
                <a data-role="button" href="#" onclick='SignUp();'>Save</a>
            </form>
        </div>
</div>

当我点击“btnShowSignUp”按钮时，我调用了函数：

function ShowSignUp(){
    $('#divStart').hide();
    $('#divSignUp').show();
}

我的问题：当我点击按钮时，'divStart'消失，'divSignUp'出现，但它错过了一些jquery移动属性。为什么会这样？

谢谢！

Answer 1

您没有关注JQM的导航API。 JQM框架管理各种“页面”的显示和隐藏，并应用它们之间的任何转换：

 function ShowSignUp(){
   $.mobile.changePage( "#divStart" );
 }

有一个奇特的转变：

 $.mobile.changePage( "#divStart", { transition: "pop" });

如果你尝试做JQM的工作，你很可能会得到意想不到的结果。

http://api.jquerymobile.com/jQuery.mobile.changePage/

使用jquery mobile隐藏和显示div

1 个答案: