2016-07-14 176 views
0

多模態開cuncurrent我在導航欄「簽到」和「註冊」 2菜單項,對每一個它的模態正確地出現,是沒有問題的用戶點擊,如何防止在自舉

在「簽到「莫代爾我有一個快速鏈接,打開‘註冊’模式, enter image description here

當我點擊‘’中的‘簽到莫代爾註冊’中的‘註冊’出現併發與前一個,

我想知道我可以如何防止兩種模式同時打開。

我加價

<!-- 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> 
+1

這個【答案】(http://stackoverflow.com/questions/18253972/bootstrap-modal-close-current-open-new/28352458#28352458)可能會幫助 – Mahmoud

+0

@Mahmoud感謝很多 – zhilevan

回答

0

this solution,它只需添加data-dismiss="modal"

所以

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