HTML 表单框字段不会保持单击状态

HTML Form Box Field Won't Stay Clicked

本文关键字：单击 状态 表单 字段 HTML      更新时间：2023-09-26

我正在做一个项目，该项目需要用户登录表单才能访问页面。单击登录按钮时，我调用以下函数：

$(document).ready(function() {
$("#login").click(function(){
    $("#login").html('<form name="login" action="login" method="post" accept-charset="utf-8"><ul><li><label for="usermail">Email</label><input type="email" name="usermail" placeholder="yourname@email.com" required></li><li><label for="password">Password</label><input type="password" name="password" placeholder="password" required></li>  <li> <input type="submit" value="Login"></li>  </ul>  </form>  <form name="register" action="register" method="post" accept-charset="utf-8">  <ul>  <li><label for="username">Username</label>  <input type="username" name="username" placeholder="username" required></li>  <li><label for="usermail">Email</label>  <input type="email" name="usermail" placeholder="yourname@email.com" required></li>  <li><label for="password">Password</label>  <input type="password" name="password" placeholder="password" required></li>  <li>   <input type="submit" value="Register"></li>  </ul>  </form> ');
});});

登录按钮的div 如下所示：

 <div class="row row1" id="login"><button>Login</br><p class="glyphicon glyphicon-user"></p></button>
</row>

我目前遇到的问题是，当您单击表单的一个框时，它不会让您保持单击该框。它会立即取消单击该框，使其无法登录。有谁知道为什么会这样？任何帮助将不胜感激。

使用此代码

$("#login").click(function(){
    $("#login").html('<form ... (very long string) ');
});});

您实际上是在说"当用户单击表单的任何部分时，请完全替换表单的内容"。因此，每次单击表单时，表单都会被新内容覆盖。并且新内容没有被"点击"（你的意思是专注）。

我发现的另一种方法是解绑点击事件：将其用于参考jsFiddle。它可能会给你更好的主意，所以也发布它

$("#login").click(function(){ 
    $("#login").unbind('click');
    $("#login").html('<form..... >');
    .....
 });
相关文章：