2014-02-06 46 views
3

在我的代碼中有兩個彈出窗口。第一次用於登錄,第二次用於重置密碼。 第二個彈出窗口的鏈接位於登錄彈出窗口內。當我點擊鏈接忘記密碼時,我想自動關閉登錄彈出窗口。Bootstrap 3:如何使用jQuery關閉彈出窗口?

<a href="#" data-toggle="modal" data-target=".loginform">Login</a> 
<!- Login Popup start--> 

<div id="login" class="modal fade loginform" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"> 
    .... 
    <label> 
     <input type="checkbox"><span style="font-size:12px;display:block;">Remember me</span> 
    </label> 
</div> 
</div> 
</div> 


</div> 
<div class="modal-footer"> 
    <a data-toggle="modal" data-target=".forgotpassword" href="#" style="float:left;font-size:14px;">Forgot Password</a> 
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
    <button type="button" class="btn btn-primary">Login</button> 
</div> 
</div> 
<!-- /.modal-content --> 
</div> 
</div> 


<!- popuplogin end--> 
<!- Popup forgot password start--> 

<div id="forgot" class="modal fade forgotpassword" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true"> 
    ....... 
    <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Reset</button> 
    </div> 
</div> 
<!-- /.modal-content --> 
</div> 
</div> 


<!- popup end--> 

Jsfiddle demo

+2

你真的需要修復indentaion。 –

+0

你真的認爲另一種模態的模態是頂級UX設計嗎?我不。 –

+0

點擊進入第二個鏈接時,我想關閉第一個模型。我對UX設計瞭解不多。但我試圖做到這一點.. – mridul

回答

9

保持一個ID爲忘記密碼的鏈接和點擊做$('#login').modal('hide');

$("#forgotPass").click(function(){ 
     $('#login').modal('hide'); 
}); 

FIDDLE