//script to show magnific popup
<script>
$('.gallery-lb').each(function() { // the containers for all your galleries
$(this).magnificPopup({
delegate: 'a', // the selector for gallery item
type: 'image',
gallery: {
enabled:true
},
mainClass: 'mfp-fade'
});
});
</script>
//script to show popup
(function ($) {
[ Show modal1 ]*/
$('.js-show-modal1').on('click',function(e){
e.preventDefault();
$('.js-modal1').addClass('show-modal1');
});
$('.js-hide-modal1').on('click',function(){
$('.js-modal1').removeClass('show-modal1');
});
})(jQuery);<?php
//Quick View link at index.php page
if (count($product) > 0)
{
foreach ($product as $products){
echo'
<a href = "?qid='.$products['Product_ID'].'" class = "block2-btn flex-c-m stext-103 cl2 size-102 bg0 bor2 hov-btn1 p-lr-15 trans-04 js-show-modal1">Quick View </a>
';}?>
<!-- Display product details on magnific modal popup -->
<div class = "wrap-modal1 js-modal1 p-t-60 p-b-20">
<div class = "overlay-modal1 js-hide-modal1"></div>
<div class = "container">
<div class = "row">
<div class = "slick3 gallery-lb">
<?php
//check if query string exist in URL
if (isset($_GET['qid']) && !empty($_GET['qid'])){
//get selected product details from database and display at magnific modal popup
$selectedproduct =$app->getProductDetails($_GET['qid']);
if (count($selectedproduct) > 0){
foreach ($selectedproduct as $productdetail){
echo '
<div class = "item-slick3" data-thumb = "'.$productdetail['Product_Image'].'">
<div class = "wrap-pic-w pos-relative">
<img src = "'.$productdetail['Product_Image'].'" alt = "IMG-PRODUCT">
<a class = "flex-c-m size-108 how-pos1 bor0 fs-16 cl10 bg0 hov-btn3 trans-04" href = "'.$productdetail['Product_Image'].'"> <i class = "fa fa-expand"></i></a>
</div>
</div>
<div class = "item-slick3" data-thumb = "'.$productdetail['Product_Detail_Image01'].'">
<div class = "wrap-pic-w pos-relative">
<img src = "'.$productdetail['Product_Detail_Image01'].'" alt = "IMG-PRODUCT">
<a class = "flex-c-m size-108 how-pos1 bor0 fs-16 cl10 bg0 hov-btn3 trans-04" href = "'.$productdetail['Product_Detail_Image01'].'"><i class = "fa fa-expand"></i></a>
</div>
</div>
<div class = "item-slick3" data-thumb = "'.$productdetail['Product_Detail_Image02'].'">
<div class = "wrap-pic-w pos-relative">
<img src = "'.$productdetail['Product_Detail_Image02'].'" alt = "IMG-PRODUCT">
<a class = "flex-c-m size-108 how-pos1 bor0 fs-16 cl10 bg0 hov-btn3 trans-04" href = "'.$productdetail['Product_Detail_Image02'].'">
<i class = "fa fa-expand"></i></a>
</div>
</div>';
}
}
}?>
</div>
</div>
</div>
</div>Я хотел создать сайт электронной торговли, который отображает сведения о продукте во всплывающем окне, когда пользователь нажимает ссылку «Быстрый просмотр» определенного продукта. Однако я не могу этого сделать, поскольку строка запроса, добавленная к ссылке «Быстрый просмотр» продукта, не отображается в URL-адресе индекса при выполнении действия onclick. Следовательно, после нажатия на ссылку продукта в лайтбоксе отображается пустой результат.
URL-адрес быстрого просмотра продукта выглядит примерно так: http: //localhost/index.php? qid = (некоторые идентификатор продукта).
Я использую великолепный исходный код всплывающего окна для отображения лайтбокса.
Ожидаемый результат: при нажатии на ссылку быстрого просмотра продукта появится всплывающее окно со сведениями о выбранном продукте на странице URL-адреса индекса.
Как я могу добавить строку запроса к URL-адресу индекса при щелчке ссылки href, чтобы соответствующие сведения о продукте можно было получить из базы данных на основе строки запроса qid (также известного как идентификатор продукта) и отобразить в лайтбоксе. Был бы признателен, если бы кто-нибудь помог мне с этим. :)
Например, мой URL-адрес страницы по умолчанию - локальный / index.php, после того, как пользователь щелкнет ссылку быстрого просмотра продукта, URL-адрес должен быть локальный / index.php? qid = 1, где qid - это динамический идентификатор, полученный из базы данных, и уникальный идентификатор для каждого продукта.
Это href-код на index.php: <a href = "? Qid = '. $ Products [' Product_ID '].'" Class = "block2-btn flex-cm stext-103 cl2 size-102 bg0 bor2 hov -btn1 p-lr-15 trans-04 js-show-modal1 "> Быстрый просмотр </a>
При нажатии на ссылку href он указывает на эту js-функцию, которая отображает модальное всплывающее окно для получения сведений о продукте: (function ($) {[Show modal1] * / $ ('. Js-show-modal1'). On ('click' , функция (e) {e.preventDefault (); $ ('. js-modal1'). addClass ('show-modal1');});
В настоящее время я не могу показать подробную информацию о продукте, поскольку URL-адрес не показывает строку запроса идентификатора продукта. Поскольку я новичок в javascript, я был бы признателен, чтобы кто-нибудь помог мне с некоторым примером. Большое спасибо.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


Что-то вроде этого
<a onclick = "window.location='http://localhost/index.php'+window.location.search;">Quick View</a>
может быть?
это обновит страницу. это перенаправление
@VinaySheoran Верно, я неправильно понял вопрос. Хотя кое-что узнал из вашего ответа, так что спасибо!
Для этого нам не нужно столько кода, если вы просто хотите добавить что-то в URL-адрес. вы можете просто использовать функцию .pushState на javascript.
history.pushState({}, "page title", "?qid=some_product_id or anything");
Подробности здесь: https://developer.mozilla.org/en-US/docs/Web/API/History_API#Adding_and_modifying_history_entries
это также будет присутствовать в истории.
Вы можете использовать следующий код и добавить параметры в строку запроса
window.history.replaceState (ноль, ноль, «? param1 = значение»);
Спасибо всем за быстрый ответ. Однако я ищу не это. Я хотел бы отображать строку запроса на той же странице после того, как пользователь щелкнет гиперссылку быстрого просмотра продукта со страницы index.php.