[程式開發] 如何 用jQuery或javascript 操作 Bootstrap 的Modal

一般用Bootstrap的Modal 都是用Button去觸發

<!-- Large modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button>

<div class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      ...
    </div>
  </div>
</div>

如果想要在jQuery或是javascript 操作Modal的觸發 可以這樣用

(1) 在要使用的Modal加入id 比如說 id="myModal"

(2)用下面語法即可操作

 $('#myModal').modal('show')
$('#myModal').modal('hide')
$('#myModal').modal('toggle')

參考資料
(1)http://getbootstrap.com/javascript/#modals
(2)http://getbootstrap.com/javascript/#modals-methods



沒有留言:

張貼留言