Bootstrap 模態窗手動觸發

一、HTML:

<div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content animated bounceInRight">
           <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                   <span aria-hidden="true">&times;</span>
                       <span class="sr-only">Close</span>
                 </button>
                                            
                <h6 class="modal-title">Modal title</h6>
             </div>
            <div class="modal-body">
                 <p><strong>Lorem Ipsum is simply dummy</strong> text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown.
                </p>
            <div class="form-group">
                <label>Sample Input</label> 
                <input type="email" placeholder="Enter your email" class="form-control">            
            </div>
       </div>
       <div class="modal-footer">
             <button type="button" class="btn btn-white" data-dismiss="modal">
                    Close
                </button>
                <button type="button" class="btn btn-primary">
                    Save changes
                </button>
         </div>
       </div>
   </div>
</div>

二、js代碼:

$('#myModal').modal('toggle');

三、效果:

 圖片

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章