Ajax加载更多脚本错误?

时间:2015-08-16 20:06:46

标签: javascript php jquery ajax

嘿,我测试了一个我在网上找到的loadmore脚本。 但是当你向下滚动时它没有加载内容。 当你完成向上滚动xD时加载它!

有什么问题?

这是我的代码

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

<script type="text/javascript">
$(window).scroll(function()
{
    if($(window).scrollTop() == $(document).height() - $(window).height())
    {
        $('div#loadmoreajaxloader').show();
        $.ajax({
        url: "loadmore.php",
        success: function(html)
        {
            if(html)
            {
                $("#postswrapper").append(html);
                $('div#loadmoreajaxloader').hide();
            }else
            {
                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>');
            }
        }
        });
    }
});
</script>

<div id="postswrapper">
   <div class="item">content</div>
   Hey<br>
   Hey<br>
   Hey<br>
   Hey<br>
   Hey<br>
   Hey<br>
 ---- MORE ADDED HERE BUT CUTTED OUT CAUSE WOULD BE VERY LONG! ----
   Hey<br>
   <div id="loadmoreajaxloader" style="display:none;"><center><img src="ajax-loader.gif" /></center></div>
</div>

Loadmore.php只包含一个echo,然后是包含内容的示例div。

控制台也是空的。

感谢大家:)

修改

这是一个工作JSFIDDLE我复制了但仍然是同样的问题...感谢这个小提琴的codegaze。

编辑2 这里我的代码在JSFIDDLE中工作!

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>

<script type="text/javascript">
$(document).ready(function () {
    $(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            alert("This is the end");
        }
    });
});
</script>


<div id="postswrapper">
    <div class="item">content</div>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    <br>Hey
    --- CUTTED OUT SOME MORE---
    <br>Hey
    <br>Hey
    <br>Hey
    <br>---- MORE ADDED HERE BUT CUTTED OUT CAUSE WOULD BE VERY LONG! ---- Hey
    <br>
    <div id="loadmoreajaxloader" style="display:none;">
        <center>
            <img src="ajax-loader.gif" />
        </center>
    </div>

我还从我在网上发现的示例中下载了源代码......它的工作......我在第一个视图中看到的唯一不同的是它包括Jquery 1.4.4 ????
GITHUB EXAMPLE SOURCE

1 个答案:

答案 0 :(得分:1)

这是一个带有普通html的jsfiddle,效果很好。 我认为你应该添加一个<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> </body> </html> ,如我的小提琴所示;)

更新:构建包含所有必需标记的页面,以获取有效的html页面,您的代码将正常运行。您的代码非常简单,因此您使用的巫文jquery版本并不重要。

这是一个简单的html页面。添加您的内容并检查结果。

User32 user32 = (User32) Native.loadLibrary("user32", User32.class,
            W32APIOptions.DEFAULT_OPTIONS);

    getRightWindowHandle(user32);

    System.out.println("Got right handle");

    WinDef.HWND hwnd = rightWindowHandle;
    Thread.sleep(1000);

    long y = 20 + (20 << 16);// x + (y << 16)
    WinDef.LPARAM l = new WinDef.LPARAM(y);
    WinDef.WPARAM w = new WinDef.WPARAM(0);
    user32.PostMessage(hwnd, WM_LBUTTONDOWN, w, l);
    System.out.println("Message posted");
    Thread.sleep(1000);
    user32.PostMessage(hwnd, WM_LBUTTONUP, w, l);