Как создать модальный блоггер для всплывающих переменных - PullRequest
0 голосов
/ 01 июня 2019

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

Когда я использую javascript Bootstrap, модал выскакивает ПЕРВАЯ информация о продукте по индексутолько на странице, даже когда я нажимаю на другие продукты.Когда я использую настроенный javascript, модальное всплывающее окно информации о ПОСЛЕДНЕМ продукте только на странице индекса, даже когда я нажимаю на другие продукты.

<link href='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css' rel='stylesheet'/>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js'/>
  <script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js'/>


<button type="button" class="btn btn-info" data-toggle="modal" data-target="#Shop">view</button>

<div id="Shop" aria-hidden="true" aria-labelledby="Shop" class="modal fade in" role="dialog" tabindex="-1" display="block">

  <div class="modal-dialog modal-lg">
    <div class="modal-content simpleCart_shelfItem">
      <div class="modal-header">
        <button aria-hidden="true" class="close" data-dismiss="modal" type="button">×</button>
          <h4 class="modal-title"><a expr:href='data:post.href'><data:post.title/></a></h4>
        </div>  
      </div> 
    </div> 

Это сценарий, который я использую (показывает последнюю информацию о продукте):

<script>


$('#Shop').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget)
  var title = &quot;<data:post.title/>&quot;;
  var modal = $(this)
  modal.find('.modal-title').text(title)
})
</script>
...