0

我有一个简单的 HTML/Javascript 表单，它在提交时会检查用户名并通过 Parse(.com) 传递，并根据特定用户显示正确的页面。

首次提交表单时，一切运行良好。但是当提交然后返回到表单页面（使用浏览器的后退按钮）时，提交事件不再被触发（甚至不是 console.log()）。不是按提交按钮，也不是按 Enter。

以下是一些代码片段：

头：

$(document).ready(function() {
    $("#form_login").submit(function(e) {
      console.log("In form submit login")
      init();
      var name = $("#inp_user").val();
      var pass = $("#inp_pass").val();
      console.log("Name: " + name + " User: " + pass)
      login(name, pass);
    })
 })

身体：

<body>
<div data-role="page" id="page_login" data-theme="a">
    <div data-role="header">
        <h1>Login Screen</h1>
    </div>
    <div data-role="content">
        <div class="div-widget">
            <h3>Login details</h3>
            <form id="form_login">
                <div data-role="fieldcontain">
                    <label for="inp_user">User name:</label> <input type="email"
                        id="inp_user">
                </div>
                <div data-role="fieldcontain">
                    <label for="inp_pass">Password</label> <input type="password"
                        id="inp_pass">
                </div>
                <input type="submit" id="btn_login" value="Login"></input>
            </form>
        </div>
        <div class="div-widget">
            <span id="out_res"></span>
        </div>
    </div>
</div>
//More div data-role="page" here....
</body>
4

1 回答 1

0

根据给定的信息，我在jsFiddle上做了一个新示例。所以你忘了提到你正在使用jquery-mobile. 此外，使用<form>确实会导致描述的行为！

<body>
    <div data-role="page" id="page_login" data-theme="a">
        <div data-role="header">
            <h1>Login Screen</h1>
        </div>
        <div data-role="content">
            <div class="div-widget">
                <h3>Login details</h3>
                <!-- removed form - as you do not really need it-->
                <!-- you may keep it, but you MAY NOT submit the form! -->
                <div data-role="fieldcontain">
                    <label for="inp_user">User name:</label>
                    <input type="email"
                        id="inp_user">
                </div>
                <div data-role="fieldcontain">
                    <label for="inp_pass">Password</label>
                    <input type="password"
                        id="inp_pass">
                </div>
                <!-- <input type="submit" id="btn_login" value="Login"></input>-->
                <!-- instead, make use of button -->
                <a id="btn_login" href="#page_2" data-role="button">Login</a>
            </div>
            <div class="div-widget">
                <span id="out_res"></span>
            </div>
        </div>
    </div>
    <div data-role="page" id="page_2" data-theme="a">Page 2</div>
    <!-- More div data-role="page" here....  -->
</body>

我没有提交表单 - 在浏览器中点击“返回”时会导致问题，而是决定使用 href - data-role="button"。绑定一个点击处理程序，prevent-Default如果登录失败（现在注释掉）

$(document).ready(function() {
    $("#btn_login").click(function(e) {
      console.log("clicked href")

      //init(); // commented out as not provided within your question
      var name = $("#inp_user").val();
      var pass = $("#inp_pass").val();
      console.log("Name: " + name + " User: " + pass)
      //login(name, pass); // commented out as not provided within your question

      /*if (LOGIN_FAILED)
      {
          console.log("login failed");
          e.preventDefault(); 
      }*/
    })
 })
于 2013-07-18T06:32:58.923 回答