Загружать Bootstrap Модальное содержимое только тогда, когда оно открыто - PullRequest
0 голосов
/ 06 марта 2020

Я использую Bootstrap Модальный для загрузки лайтбоксов с некоторым ресурсоемким контентом.

Но контент загружается сразу со страницы. А так как есть несколько лайтбоксов, это значительно замедляет страницу.

Я хочу, чтобы содержимое загружалось только при нажатии модальной кнопки. Но я не хочу вызывать модальный код с отдельной страницы, поскольку это все усложнит.

Есть ли способ использовать JS или AJAX для загрузки только модального содержимого когда открывается модальное окно?

Каким-то образом запускайте его загрузку при нажатии кнопки, а затем выключайте содержимое, когда окно закрыто.

Также имейте в виду, что я почти ничего не знаю о JS или AJAX.

- РЕДАКТИРОВАТЬ: Было бы здорово, если бы такое же решение могло быть применено к содержимому с вкладками -

Код I использую:

  <!-- Trigger the modal with a button -->
  <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open</button>

  <!-- Modal -->
  <div class="modal fade" id="myModal" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
        </div>
        <div class="modal-body">
<iframe width='100%' height='368' src='#' frameborder='0' allowfullscreen></iframe>
        </div>
      </div>
    </div>
  </div>
...