У меня есть страница с указателями покупок в 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 = "<data:post.title/>";
var modal = $(this)
modal.find('.modal-title').text(title)
})
</script>