weixin_33744141 2015-08-16 20:06 采纳率: 0%
浏览 4

Ajax加载更多脚本错误?

Hey i test a loadmore script which i found online. But its not loading the Content when you done scrolling down. It is loading it when you complete scrolled up xD !

What is wrong ?

Here my Code

<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 contains only a echo and then example div with contents ..

Console is also empty.

Thanks to everyone :)

EDIT

Here is a working JSFIDDLE i copied that but still same Problem... Thanks to codegaze for this Fiddle.

EDIT 2 Here my Code which is working in 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>

I also downloaded the Source from the Example which i found online... and its working ... the only different i can see on the first View is that its includes Jquery 1.4.4 ????
GITHUB EXAMPLE SOURCE

  • 写回答

1条回答 默认 最新

  • weixin_33701617 2015-08-16 20:15
    关注

    Here is a jsfiddle with plain html and works just fine. I think you should add a $(document).ready() as shown in my fiddle ;)

    UPDATE: Construct your page with all the required tags to get a valid html page and your code will work. Your code is very simple, so it doesn't matter witch jquery version you will use.

    This is a simple html page. Add your contents and check the result.

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Document</title>
    </head>
    <body>
    
    </body>
    </html>
    
    评论

报告相同问题?

悬赏问题

  • ¥15 远程桌面文档内容复制粘贴,格式会变化
  • ¥15 关于#java#的问题:找一份能快速看完mooc视频的代码
  • ¥15 这种微信登录授权 谁可以做啊
  • ¥15 请问我该如何添加自己的数据去运行蚁群算法代码
  • ¥20 用HslCommunication 连接欧姆龙 plc有时会连接失败。报异常为“未知错误”
  • ¥15 网络设备配置与管理这个该怎么弄
  • ¥20 机器学习能否像多层线性模型一样处理嵌套数据
  • ¥20 西门子S7-Graph,S7-300,梯形图
  • ¥50 用易语言http 访问不了网页
  • ¥50 safari浏览器fetch提交数据后数据丢失问题