Bootstrap modal закрывается при нажатии в любом месте

Question

Я пытаюсь использовать простой bootstrap modal, но он закрывается при щелчке по нему в любом месте, а не при нажатии на кнопку закрытия. Я не использовал никаких других дополнительных javascript или jquery-кода на странице. Вот ссылка, где мой код. Модальная кнопка запуска находится внизу.

http://aijaz.co/angloamerican/

Это код по умолчанию, я использую.

<a data-toggle="modal" href="#myModal" class="btn btn-primary btn-large">Launch demo modal</a> 


<div id="myModal" class="modal fade"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title">Confirmation</h4> 
      </div> 
      <div class="modal-body"> 
       <p>Do you want to save changes you made to document before closing?</p> 
       <p class="text-warning"><small>If you don't save, your changes will be lost.</small></p> 
      </div> 
      <div class="modal-footer"> 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
       <button type="button" class="btn btn-primary">Save changes</button> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

Попробуйте поставить data-backdrop="true" на свой #myModal элемент.

Как это:

<div id="myModal" class="modal fade" data-backdrop="true"> 

Answer 2

Добавить data-backdrop="static" как attribute из myModal. См. http://getbootstrap.com/javascript/#modals-options для более подробной информации.