Php 在用户不使用sql滚动时生成更多内容

Php 在用户不使用sql滚动时生成更多内容,php,javascript,html,domcontentloaded,Php,Javascript,Html,Domcontentloaded,我的目标是在用户向下滚动时生成以下代码: <?php // get all files $imagesDir = 'uploads/'; $images = glob($imagesDir . '* {jpg,jpeg,png,gif,JPG,JPEG,PNG,GIG}', GLOB_BRACE); $imagesCount = count($images); for($i = 0 ; $i < $imagesCount ; $i++)

我的目标是在用户向下滚动时生成以下代码:

<?php
    // get all files
        $imagesDir = 'uploads/';
    $images = glob($imagesDir . '* {jpg,jpeg,png,gif,JPG,JPEG,PNG,GIG}', GLOB_BRACE);
    $imagesCount = count($images);
    for($i = 0 ; $i < $imagesCount ; $i++) {
        // select image 
        $randomIndex = array_rand($images); // select image index
        $file_title = $randomImage = $images[$randomIndex]; // use selected image
        unset($images[$randomIndex]); // remove selected image
        // print_r($images); // you can see what left in $images
        // show image
    }   
?>

<li class="item-thumbs span3 img">
   <!-- Fancybox - Gallery Enabled - Title - Full Image -->
   <a class="hover-wrap fancybox" data-fancybox-group="gallery" 
       title="<?php echo $randomImage ?>" href="<?php echo $randomImage ?>">
   <span class="overlay-img"></span>
   <span class="overlay-img-thumb font-icon-plus"></span>
   </a>
   <!-- Thumb Image and Description -->
   <img src="<?php echo $randomImage ?>" alt="{Failed To Load Item Description}">
</li>

  • “alt=“{未能加载项目说明}”>

  • 这段代码是在一个块中找到的。我想生成随机图像,并将它们显示在一个格式良好的区域中。现在,除了我需要自动生成这段代码,以便在用户滚动时显示更多内容……就像Facebook在你向下滚动时在墙上加载更多帖子一样。我尝试了许多脚本,但没有一个其中一个对我有用。

    你的查询答案是:第一件事*你必须在javascript中设置一个滚动处理程序,每当用户向上或向下滚动时就会触发该处理程序*你必须调用ajax来获取结果 在调用滚动处理程序*时,最后一件事是呈现ajax响应

    但您必须在滚动处理程序中管理用户是向上还是向下b/c每当用户向下滚动时,您都需要数据

    因此,我给出了一些代码示例,它使用jquery

    滚动处理程序

    var lastScrollTop = 0;
    var scrollHandler = function () {
    var st = $(this).scrollTop();
    var pageHeight = $(document).height();
    var pageScrolled = $(window).scrollTop();
    var pageView = $(window).height();
    if (st > lastScrollTop) {
        // downscroll code
        if (st > lastScrollTop && (pageScrolled >= (pageHeight / 2))) {
            // calling scroll     after half page scrolled
            //  do nothing
        } else {
            loadMore(); // it will be called only in scroll down
        }
    }
    
    
    lastScrollTop = st;
    
    }

    将ajax调用放在这个函数中

    function loadMore() {
    $(window).off("scroll", scrollHandler);
    $.ajax({
        url: "",
        "data": '',
        success: function () {
            //  render you ajax response
            ....
            $(window).scroll(scrollHandler); // call event handle after first result render
        }
    
    });
    
    }

    //加载窗口后附加滚动事件

    $(window).load(function () {
        $(window).scroll(scrollHandler);
    });
    
    剩下的逻辑是如何确定加载了多少个结果以及最后一个结果是什么

    所以,在最后一个参数中加入一个额外的逻辑,它将告诉您这是一个las结果 在调用loadMore()之前,
    阅读该参数并发送回ajax调用。

    我已经阅读了一些内容,这些内容确切地告诉我,但它不起作用。要么这不起作用,要么我做错了。在我发疯之前,你或其他人能在我的代码中实现这一点吗?我很难理解如何加载数据,如何定义加载内容。我要学习的一个教程,删除所有图像,并将其替换为从url加载的另一个php文件中找到的字符串。每次用户滚动时,我只希望在最后一行下面加载另外12个图像。我发现的任何内容都不能很好地解释如何实现这一点。谢谢。好的,我可以帮助您,但我需要确切地了解您有什么以及您希望应用什么y、 作为你想显示多少结果等。我们可以过来聊天吗?谢谢。如果你去这里:你可以查看我正在使用的网站。有一个缩略图图标列表。这些缩略图图标将被我加载的随机图像替换。我希望该网站自动加载12个以上的随机图像(以前没有显示过的图像)当用户向下滚动时。当没有更多的图像可加载而不显示重复图像时,我希望显示一条消息,内容如下:“没有更多内容,请上传!“或者类似的东西。另外,以防万一,我想要一个加载内容的按钮。谢谢!如果你有任何其他问题,请告诉我。太棒了,让我知道!