1

我有我的索引文件作为用户输入用户名和密码的对话框。该页面在它是一个时工作正常,data-role="page但作为一个对话框,该对话框显示并迅速消失。它基本上会在屏幕上闪烁,我不知道为什么。我的代码如下:

HTML

<body onload="init()">

<div id="home">

    <div id="launcherPage" data-role="page">
        <!-- I'm just here waiting for deviceReady -->
    </div>


    <div data-role="dialog" id="loginPage">

        <div data-role="header">
          <h1>CHUNE</h1>
        </div>

        <div data-role="content">    

            <form id="loginForm">
            <div data-role="fieldcontain" class="ui-hide-label">
                <label for="username">Username:</label>
                <input type="text" name="username" id="username" value="" placeholder="Username" />
            </div>

            <div data-role="fieldcontain" class="ui-hide-label">
                <label for="password">Password:</label>
                <input type="password" name="password" id="password" value="" placeholder="Password" />
            </div>

            <input type="submit" value="Login" id="submitButton">
            </form>
            <div style="text-align: center;">Or</div> <!--need to center-->
            <a href="./register.html" data-role="button">Register</a>

        </div>

        <div data-role="footer">
            <h4>&copy; KewsPlus</h4>
        </div>

    </div>

jQuery

function deviceReady() {
console.log("deviceReady");
$("#loginPage").on("pageinit",function() {
    console.log("pageinit run");
    $("#loginForm").on("submit",handleLogin);
    checkPreAuth();
});
$.mobile.changePage("#loginPage");
4

1 回答 1

1

要在加载时以编程方式打开对话框,您需要设置超时以确保页面在打开之前完全加载到 DOM 中。

$(document).on('pageshow', '#myPage' ,function () {
 setTimeout(function () {
  $.mobile.changePage('#dialog');
 }, 100); // delay above zero
});

类似问题

于 2013-04-21T06:50:03.193 回答