当我在php页面中向下滚动加载div

时间:2015-07-29 10:41:45

标签: javascript php ajax

为E-com创建一个PHP页面。我在数据库中有100个产品,但使用以下代码在页面中仅显示12个产品

product.php

<?php 
$sql = mysql_query("select * from products limit 12");
while($row = mysql_fetch_array($mysql))
{
$p_img = $row['product_image'];
$p_name = $row['product_name'];
$p_desc = $row['product_desc'];
$p_price = $row['price'];
?>
<div class="col-xs-18 col-sm-6 col-md-3 ">
  <div class="thumbnail">
     <img src="images/product/<?php echo $p_img; ?>" alt="products"  />
     <div class="caption">
     <h4><?php echo $p_name;?></h4>
     <p><?php echo $p_desc;?></p>
     <p style="font-size:17px;"><b><i class="fa fa-inr"></i> <?php echo $p_price;?></p>
     <p><a href="#" class="btn btn-info btn-xs" role="button">Button</a> 
        <a href="#" class="btn btn-default btn-xs" role="button">Button</a></p>
   </div>
</div><!--thumbnail end-->

我的问题是当我滚动muose时在同一页面中添加更多8个产品。我该如何添加?

感谢您提前。

2 个答案:

答案 0 :(得分:0)

在页面滚动到70%示例后写一个ajax函数:

if ($(window).scrollTop() >= ($(document).height() - $(window).height())*0.7) {
   callajaxhere();
}

function callajaxhere(){
   // ajax call to load products
}

答案 1 :(得分:0)

例如,当您滚动页面时,窗口会滚动70%。

if ($(window).scrollTop() >= ($(document).height() - $(window).height())*0.7){
     $.ajax({url: "phpfile.php", success: function(result){
        $("body").html(result);
     }});
}

在你要求的php文件中,你打印下一个8.这将在变量result中。所以results包含接下来的8个,用Jquery或javascript添加它也是你的页面。以下是AJAX的文档,如果您想用它做更多的事情。