如何防止在自举

Question

多模态开cuncurrent我在导航栏“签到”和“注册” 2菜单项，对每一个它的模态正确地出现，是没有问题的用户点击，

在“签到“莫代尔我有一个快速链接，打开‘注册’模式，

当我点击‘’中的‘签到莫代尔注册’中的‘注册’出现并发与前一个，

我想知道我可以如何防止两种模式同时打开。

我加价

<!-- Sign In Modal --> 
<div id="signin" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
     <!-- Modal content--> 
     <div class="modal-content"> 
      <div class="modal-header nopadding"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <div class="login-head"> 
        <img src="/{{ directory }}/images/logo.png" /> 
       </div> 
      </div> 
      <div class="modal-body"> 

       <form method="post" id="user-tclogin-form" accept-charset="UTF-8" _lpchecked="1" action="{{ path("user.login") }}" class="user-login-form" data-drupal-selector="user-login-form" role="form" name="loginform"> 
        <div class="form-group headline "> 
         <h3>{{ 'Login with your account or'|t }}<a class="" data-toggle="modal" data-target="#signup"> {{ 'Sign Up'|t }}</a></h3> 
        </div> 
        <div class="form-group"> 
         <input type="text" value="{{ username }}" name="name" tabindex="1" class="form-control" id="name" placeholder="{{ "username or email"|t}}"> 
        </div> 
        <div class="form-group"> 
         <input type="password" class="form-control" id="pass" name="pass" placeholder="{{ "Password"|t }}"> 
        </div> 

        <input type="submit" id="tclogin" class="btn btn-lg navbar-btn btn-courses-reverse" value="{{ "Sign In"|t }}" > 
        <div class="form-group remember"> 
         <label><input type="checkbox">{{ "Remember me"|t }}</label> 
         <a class="forgetpass" data-toggle="modal" data-target="#forgetpass"> {{ 'Forget Password'|t }}</a> 
        </div> 
        <input type="hidden" name="_csrf_token" value="{{ csrf_token }}" /> 
       </form> 
      </div> 

     </div> 

    </div> 
</div> 
<!-- Sign Up Modal --> 
<div id="signup" class="modal fade" role="dialog"> 
    <div class="modal-dialog"> 
     <!-- Modal content--> 
     <div class="modal-content"> 
      <div class="modal-header nopadding"> 
       <button type="button" class="close" data-dismiss="modal">&times;</button> 
       <div class="login-head"> 
        <img src="/{{ directory }}/images/logo.png" /> 
       </div> 
      </div> 
      <div class="modal-body"> 

       <form method="post" id="user-tclogin-form" accept-charset="UTF-8" _lpchecked="1" action="{{ path("user.login") }}" class="user-login-form" data-drupal-selector="user-login-form" role="form" name="loginform"> 
        <div class="form-group headline "> 
         <h3>{{ 'Login with your account or'|t }}<a class="" data-toggle="modal" data-target="#signup"> {{ 'Sign Up'|t }}</a></h3> 
        </div> 
        <div class="form-group"> 
         <input type="text" value="{{ username }}" name="name" tabindex="1" class="form-control" id="name" placeholder="{{ "username or email"|t}}"> 
        </div> 
        <div class="form-group"> 
         <input type="password" class="form-control" id="pass" name="pass" placeholder="{{ "Password"|t }}"> 
        </div> 

        <input type="submit" id="tclogin" class="btn btn-lg navbar-btn btn-courses-reverse" value="{{ "Sign In"|t }}" > 
        <div class="form-group remember"> 
         <label><input type="checkbox">{{ "Remember me"|t }}</label> 
         <a class="forgetpass" data-toggle="modal" data-target="#forgetpass"> {{ 'Forget Password'|t }}</a> 
        </div> 
        <input type="hidden" name="_csrf_token" value="{{ csrf_token }}" /> 
       </form> 
      </div> 

     </div> 

    </div> 
</div> 

Answer 1

据this solution，它只需添加data-dismiss="modal"。

所以

<a class="" data-toggle="modal" data-dismiss="modal" data-target="#signup"> {{ 'Sign Up'|t }}</a>