Bootstrap 对话框提示（表单）不起作用

Question

你们能帮帮我吗？我正在使用 boostrap.. 我在对话框提示中创建了登录表单，但它不起作用..

这是 link

<a href="#login" data-toggle="modal">LOGIN</a>

这是对话提示的编码

<div class="modal fade" id="login" role="dialog">
  <div class="modal-dialog">
     <div class="modal-content">
      <form method="post" class="form-horizontal" role="form">
      <div class="modal-header">
   <h4>Login</h4>
   <div>
   <div class="modal-body">
    <div class="form-group">
    <label for="username" class="col-sm-2 control-label">Name</label>
      <div class="col-sm-10">
   <input type="text" class="form-control" name="username" id="username" placeholder="User Name">
      </div>
  </div>
    <div class="form-group">
   <label for="password" class="col-sm-2 control-label">Password</label>
   <div class="col-sm-10">
   <input type="password" class="form-control" name="password" id="password" placeholder="&#xf111; &#xf111; &#xf111; &#xf111; &#xf111; &#xf111;" style="font-family:Arial, FontAwesome">
   </div>
  </div>
     
  </div>
  <div class="modal-footer">
    <a class="btn btn-default" data-dismiss="modal"> CLOSE </a>
   <button type="submit" class="btn btn-primary" name="login"> LOGIN </button>
  </div>
  </div>
  </div>
  </form>
 </div>
  </div>
</div>

当我点击登录 link 时，它只会刷新页面，link 将从 localhost/signup.php 变为 localhost/signup.php#登录

请帮助我。

Answer 1

这应该有效.. 添加 date-target=""

<button class="btn btn-primary" data-toggle="modal" data-target="#login">LOGIN</button>

确保您已导入 bootstrap.css、bootstrap.js 并且还需要 jQuery！

Answer 2

您可以尝试 [a href="#" data-toggle="modal" data-target="#login"] LOGIN [/a] 而不是 [a href="#login" data-toggle="modal"] LOGIN[/a] 并再次检查。

[Note: Change the square braces to angular braces.]

如果不起作用，则可能是您没有在页面中添加 bootstrap.js。

因此，首先在您的页面中添加 bootstrap.css，然后添加 jquery.js，然后添加 bootstrap.js，然后添加任何其他自定义 .js 页面。

Bootstrap 对话框提示（表单）不起作用

Bootstrap dialog prompt (form) not work

forms

twitter-bootstrap

dialog

prompt

bootstrap-form-helper