jQuery滑块一次加载一个内容

时间:2012-12-05 05:02:37

标签: php javascript jquery mysql bxslider

我有一个滑块可以同时加载我的所有内容。进入div。像这样:

external page.php

$get_users = mysql_query("SELECT * FROM user WHERE id!='$user_id'"); 
while ($rows = mysql_fetch_assoc($get_users)) {
$id = $rows['id'];
$firstname = $rows['firstname'];

$display_info .= '
<div class="f_outer" id="' . $id . '">
    <div class="f_name likeu">' . $firstname . '</div>
</div>';
}
    echo $display_info;

我使用bxslider

从我的find.php页面调用此页面

这是我在下面的find.php页面。

    <script type="text/javascript">
$(function() {
    var slider = $("#slider1").bxSlider();
    $("#slider-like").live('click', function() {
        slider.goToNextSlide();
        return false;
    });
    }); 
    </script>

    <div id="slider-like>Yes</div>
    <div id="slider1">
    <?PHP
    include ("external.php");
    ?>
    </div>

所以我得到的是find.php页面上的所有.f_outer div。我有数百个用户,他们将立即加载。我想一次只加载一张幻灯片。因此,当我单击#slider-like时,它会从我的外部页面加载我的一个潜水。

1 个答案:

答案 0 :(得分:0)

如果您加入external.php,则会从user加载所有数据。如果要动态加载,则需要使用ajax而不是在服务器上包含该文件。您可以使用JS或php会话跟踪您的用户。我认为前者更容易:

var nextUser = 0;
$(document).on('click', '#slider-like', function (e) {
   var slider = $("#slider1").bxSlider();
   $("#slider1").load("getuser.php?num=" + nextUser, function () {
      slider.goToNextSlide();
      nextUser++;
   });
   e.preventDefault();
});

然后,在getuser.php上,您将拥有:

$num = isset($_GET['num']) ? $_GET['num'] : exit;
$query = "SELECT * FROM user WHERE id != '$user_id' LIMIT $num,1";

查询$num用户并将其限制为一个结果。

注意: 您应该使用PDOmysqli代替mysql_*。 <{1}}和$user_id都需要转义。