//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>
我想创建一个电子商务网站,当用户单击特定产品的“快速查看”链接时,该网站在灯箱弹出窗口中显示产品详细信息。但是,我无法这样做,因为执行onclick操作时,附加在产品“快速查看”链接上的查询字符串不会显示在索引URL上。因此,点击产品链接后,灯箱将显示空白结果。
产品快速查看URL看起来像这样:http://localhost/index.php?qid=(some产品ID)。
我正在使用巨大的弹出源代码来显示灯箱。
预期结果:单击产品快速查看链接后,将弹出一个灯箱,以在索引URL页面中显示所选产品的产品详细信息。
如何在单击href链接时将查询字符串添加到索引URL,以便可以基于查询字符串qid(又称为产品ID)从数据库中获取适当的产品详细信息,并显示在灯箱中。希望有人帮助我。 :)
答案 0 :(得分:0)
类似这样
void FixedUpdate () {
if(forwardSpeed < maxSpeed)
{
forwardSpeed += Time.deltaTime * speedIncrementor;
}
rb.velocity = new Vector3(0, rb.velocity.y, forwardSpeed * Time.deltaTime);
if (forwardSpeed > maxSpeed)
{
forwardSpeed = maxSpeed;
}
}
也许吗?
答案 1 :(得分:0)
如果您只想在url中添加一些内容,则不需要太多代码。您可以只在JavaScript上使用.pushState
函数。
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
这也将保留历史。
答案 2 :(得分:0)
您可以使用以下代码并向查询字符串中添加参数
window.history.replaceState(null,null,“?param1 = value”);