0

我正在尝试使用无限滚动将接下来的 5 个内容加载到我的屏幕上,而无需重新加载整个页面。我已经尝试了大约一百万件事。我的滚动条跟踪效果很好,但我不知道如何设置 ajax 请求以在激活滚动条脚本时加载其他内容。请帮助我已经坚持了两天。

这是我的java脚本:

    <script type="text/javascript">
    function yHandler(){
var wrap = document.getElementById('wrap');
var contentHeight = wrap.offsetHeight;
var yOffset = window.pageYOffset; 
var y = yOffset + window.innerHeight;
if(y >= contentHeight){
    // Ajax call to get more dynamic data goes here
    wrap.innerHTML += '<div class="newData"></div>';
}
var status = document.getElementById('status');
status.innerHTML = contentHeight+" | "+y;
}

window.onscroll = yHandler;
</script>

这是我连接到我的数据库的 php 文件:

    <?php

    # FileName="Connection_php_mysql.htm"
    # Type="MYSQL"
    # HTTP="true"
    $hostname_dbConn = "localhost";
    $database_dbConn = "Video";
    $username_dbConn = "root";
    $password_dbConn = "root";
    $dbConn = mysql_pconnect($hostname_dbConn, $username_dbConn, $password_dbConn) or trigger_error(mysql_error(),E_USER_ERROR); 

    ?>
4

1 回答 1

0

注意:正如其他评论者所指出的,将更好的图片与各个部分放在一起,但这至少应该让你走上正确的轨道。

这个问题非常广泛,但对于 AJAX 位使用jQuery!我能想到的最简单的事情,而不涉及太多细节。

JS

var last_grabbed = 5;
function scrollListen() {
    ...
    $.post('path/to/script.php',{ 'last_row' : last_grabbed },function(response) {
        $('.my-content-div').append(response);
        last_grabbed += 5;
    });
}

PHP

<?php
//your connection stuff, db select, etc
$row = $_POST['last_row']; //you should sanitize this though
$rs = mysql_query("SELECT ... LIMIT $row,5") or die(mysql_error());
while($row = mysql_fetch_assoc($rs)) {
?>
<!-- Do you HTML stuff here for each item !-->
<?php
}
?>

那应该让你开始。http://www.w3schools.com/php/php_mysql_intro.asp有关 PHP 方面的更多信息。

于 2013-06-12T18:12:40.847 回答