Question

我有一个模态。在模态的标题中，我有标题，即登录。在身体我有一个登录表单，在页脚我有登录按钮。

在登录按钮之后，我为那些想要创建帐户的人提供了超文本，通过点击它，登录表单就会消失并显示注册表单。

我是否有可能使用相同的按钮登录进行注册。（最简单的说法是可以使用2种不同形式的相同按钮，或者如果我不能，我怎样才能在页脚中添加按钮并使其作为重复表单的提交按钮）

<div class="modal fade" id="myModal" role="dialog">
<div class="modal-dialog modal-lg">
  <div class="modal-content">
         <div class="modal-header" style="background-color: #222">
              <div class="mu-title">
              <span class="mu-subtitle" id = "loginTitle">Login</span>
        </div>
  </div>
  <!-- Body of the modal --> 
  <div class="modal-body" style="background-color: #222">

                      <form id="registerForm" method="POST" action="register.php" novalidate="novalidate" style="display: none">
                            <div class="form-group">
                              <label for="name" class="control-label" style="color: white">Full Name</label>
                              <input type="text" class="form-control" id="fullName" name="fullName" value="" required="" title="Please enter you full name" placeholder="Full Name">
                              <span class="help-block"></span>
                          </div>
                          <div class="form-group">
                              <label for="username" class="control-label" style="color: white">Username</label>
                              <input type="text" class="form-control" id="username" name="username" value="" required="" title="Please enter you username" placeholder="username@siswa.um.edu.my">
                              <span class="help-block"></span>
                          </div>
                          <div class="form-group">
                              <label for="password" class="control-label" style="color: white">Password</label>
                              <input type="password" class="form-control" id="password" name="password" value="" required="" title="Please enter your password">

                          </div>
                           <div class="form-group">
                              <label for="matrix" class="control-label" style="color: white">Matrix Number</label>
                              <input type="text" class="form-control" id="matrixNO" name="matrixNO" value="" required="" title="Please enter you Matrix Number" placeholder="Matrix Number ">
                              <span class="help-block"></span>
                          </div>
                      </form>

                      <form id="loginForm" method="POST" action="login.php" novalidate="novalidate">
                          <div class="form-group">
                              <label for="username" class="control-label" style="color: white">Username</label>
                              <input type="text" class="form-control" id="username" name="username" value="" required="" title="Please enter you username" placeholder="username@siswa.um.edu.my">
                              <span class="help-block"></span>
                          </div>
                          <div class="form-group">
                              <label for="password" class="control-label" style="color: white">Password</label>
                              <input type="password" class="form-control" id="password" name="password" value="" required="" title="Please enter your password">

                          </div>
  </div>

  <div class="modal-footer" style="background-color: #222">
          <button type="submit"  id ="loginButt" class="mu-readmore-btn">Login</button></br></br>
          </form>
          <span style="color: white" >Create an <a href= "#" style="color: white" onClick="$('#loginForm').hide();$('#registerForm').show();  " >Account</a> </span>

  </div>
  </div>

Answer 1

以下是一些你可以试用的样板....（你的部分基本上只是确定哪种形式是活跃的......）

＆＃13;

$(document).ready(function(){
  $('#submitbtn').click(function(e){
  e.preventDefault();
  var form=$('#currentForm').val();
    if(form=="login")
      {
        alert('submit to login');
      }
    else
      {
        alert('submit to register');
      }
  });
  $('#btnchange').click(function(){
    var form=$('#currentForm').val();
    if(form=="login")
      {
        $('#currentForm').val('register');
        $('#registration-form').show();
        $('#login-form').hide();
      }
    else
      {
        $('#currentForm').val('login');
        $('#registration-form').hide();
        $('#login-form').show();
      }
  });
  
  
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
<form method="post" action="register.php" name="registration-form" id="registration-form" style="display:none;">
  <label for="name">Name:</label>
    <input type="text" name="usename"><br/>
  <label for="emailid">Email ID:</label>
    <input type="text" name="emailid"><br/>
  <label for="password">Password :</label>
    <input type="password" name="password">
</form><br/><br/>
<form method="post" action="login.php" name="login-form" id="login-form">
  <label for="emailid">Email ID :</label>
    <input type="text" name="emailid">
  <label for="password">Password :</label>
    <input type="password" name="password">
</form>
<input type="hidden" value="login" id="currentForm"/>
    <input type="button" value="Submit" name="submitbtn" id="submitbtn">
<input type="button" value="Toggle Form" id="btnchange"/>

＆＃13;

Answer 2

正因为如此，我才能更好地理解您的问题，您尝试做的基本想法是：

单页模式，一种形式。获取用户文本输入，检查具有该信息的现有用户，如果不存在则创建新用户？

更改放置在模态页脚中的按钮的任务

2 个答案: