4

Добрый день. В Bootstrap при нажитаи на кнопку

<button id="bs-example-modal-lg-newOrder" class="btn btn-info" type="button" data-toggle="modal" data-target=".bs-example-modal-lg-newOrder">Новый</button>

Появляется стандартное модальное окно.

почитать можно тут: http://getbootstrap.com/javascript/

Как решить задачу, чтобы модальное окно не закрывалось при нажатии на темный фон, а только при нажатии на кнопку закрыть?

1 ответ 1

10
<script type="text/javascript">
    $('#myModal').modal({
      backdrop: 'static',
      keyboard: false
    })
</script>

Или

<div class="modal fade" id="myModal" role="dialog" data-backdrop="static" data-keyboard="false">

Пример:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  
<div class="container">
  <h2>Modal Example</h2>
  <!-- Trigger the modal with a button -->
  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button>

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog" data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog">
    
      <!-- Modal content-->
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Modal Header</h4>
        </div>
        <div class="modal-body">
          <p>Some text in the modal.</p>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
      
    </div>
  </div>
  
</div>

Update by @Other:
Свойство backdrop управляет фоном:
true - затемнение, закрывает окно по клику на фон.
false - без затемнения, фона нет -> кликать некуда.
static - фон есть, клик по фону не закрывает окно. <-- Это Вам нужно.

0

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.