Question

我m buissy for two day找出我能解决这个问题的方法

第一页正常加载我的问题如何获得加载其他页面的$ id？

第一页加载？id = 1 但在下一页我得到一个错误

注意：未定义的索引：id in 第5行的C：\ xampp \ htdocs \ Comments \ user \ 2 \ ajax.php

这是我的ajax.php

<?php 

 include('../connection.php');

 $id = (int) $_GET['id'];

 $sql=mysqli_query($conn,"SELECT * FROM `user` WHERE id='" . $id . "' ");
 $users=mysqli_fetch_assoc($sql);

 ?>


<?php
// Simulate slow server just to see loading indicator
sleep(2);

$type = isset($_GET['type']) ? $_GET['type'] : 'images';
switch ($type)
{
case 'data':
    foreach (range(0,2) as $i)
    {
        ?>
        <div class="row-item">

        </div>
        <?php
    }
    break;
case 'images':
default:
    $arr = array();

    $dir = '../../images/'. $users['email'] .'/';
    if ($handle = opendir($dir))
    {
        while (false !== ($entry = readdir($handle)))
        {
            if ($entry != "." && $entry != "..")
            {
                $arr[] = $dir.$entry;
            }

        }
        closedir($handle);
    }

    $cnt = count($arr);

    $items = array();
    foreach (range(1,9) as $i)
    {
        $items[] = $arr[rand(0, $cnt-1)];
    }


    foreach (range(0,2) as $i)
    {
        ?>
        <div class="row-item">
            <img src="<?php echo $items[3*$i]; ?>" class="img-responsive" alt="" />
            <img src="<?php echo $items[3*$i+1]; ?>"  class="img-responsive" alt="" />
            <img src="<?php echo $items[3*$i+2]; ?>" class="img-responsive" alt="" />
        </div>
        <?php
    }
    break;
    }
    ?>



<html>
<head>
    <meta charset="utf-8">
    <title>jQuery Infinte Scroll plugin</title>
    <link href="pjInfiniteScroll.css" rel="stylesheet">
    <link href="examples.css" rel="stylesheet">
    <script src="jquery-1.7.min.js"></script>
    <script src="jquery.pjInfiniteScroll.js"></script>
    <script>
    $(function () {
        $(document).pjInfiniteScroll();
    });
    </script>
    </head>


 </html>

＆安培;这是我的javascript代码

/*!
* jQuery Infinite Scroll plugin 1.0
*
 * Copyright 2014, PHPJabbers.com (http://www.phpjabbers.com/free-jquery-
 infinite-scroll-script/)
* Licensed under the MIT (http://www.opensource.org/licenses/mit-license.php) license.
* 
* Date: Mon Jan 20 12:37:15 2014 +0200
*/
(function ($, undefined) {
var PROP_NAME = 'scroll',
    FALSE = false,
    TRUE = true;

function InfinteScroll() {
    this._defaults = {
        offset: 20,
        autoLoad: true,
        autoLoadUntil: false,
        loadingIcon: "data:image/gif;base64,R0lGODlhEAALAPQAAP///wAAANra2tDQ0Orq6gYGBgAAAC4uLoKCgmBgYLq6uiIiIkpKSoqKimRkZL6+viYmJgQEBE5OTubm5tjY2PT09Dg4ONzc3PLy8ra2tqCgoMrKyu7u7gAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCwAAACwAAAAAEAALAAAFLSAgjmRpnqSgCuLKAq5AEIM4zDVw03ve27ifDgfkEYe04kDIDC5zrtYKRa2WQgAh+QQJCwAAACwAAAAAEAALAAAFJGBhGAVgnqhpHIeRvsDawqns0qeN5+y967tYLyicBYE7EYkYAgAh+QQJCwAAACwAAAAAEAALAAAFNiAgjothLOOIJAkiGgxjpGKiKMkbz7SN6zIawJcDwIK9W/HISxGBzdHTuBNOmcJVCyoUlk7CEAAh+QQJCwAAACwAAAAAEAALAAAFNSAgjqQIRRFUAo3jNGIkSdHqPI8Tz3V55zuaDacDyIQ+YrBH+hWPzJFzOQQaeavWi7oqnVIhACH5BAkLAAAALAAAAAAQAAsAAAUyICCOZGme1rJY5kRRk7hI0mJSVUXJtF3iOl7tltsBZsNfUegjAY3I5sgFY55KqdX1GgIAIfkECQsAAAAsAAAAABAACwAABTcgII5kaZ4kcV2EqLJipmnZhWGXaOOitm2aXQ4g7P2Ct2ER4AMul00kj5g0Al8tADY2y6C+4FIIACH5BAkLAAAALAAAAAAQAAsAAAUvICCOZGme5ERRk6iy7qpyHCVStA3gNa/7txxwlwv2isSacYUc+l4tADQGQ1mvpBAAIfkECQsAAAAsAAAAABAACwAABS8gII5kaZ7kRFGTqLLuqnIcJVK0DeA1r/u3HHCXC/aKxJpxhRz6Xi0ANAZDWa+kEAA7AAAAAAAAAAAA",
        complete: null,
        url: "",
        loadMoreText: "load more",
        loadMoreClass: "pjInfiniteScroll_LoadMore",
        loadMoreWrapperClass: "pjInfiniteScroll_LoadMoreWrapper",
        indicatorWrapperClass: "pjInfiniteScroll_IndicatorWrapper"
    };
}

$.extend(InfinteScroll.prototype, {
    _attachInfiniteScroll: function (target, settings) {

        if (this._getInst(target)) {
            return FALSE;
        }
        var $target = $(target),
            self = this,
            inst = self._newInst($target),
            height = inst.container.outerHeight(),
            scrollHeight;

        $.extend(inst.settings, self._defaults, settings);

        if (inst.container.is(document)) {
            $(window).bind("resize.scroll", function (e) {
                height = $(this).height()
            });
        }

        inst.container.on("scroll.scroll", function (e) {
            var $this = $(this);

            if ($this.is(document)) {
                scrollHeight = $(document.body).prop("scrollHeight");
            } else {
                scrollHeight = $this.prop("scrollHeight");
            }

            if (scrollHeight - height - $this.scrollTop() <= 
  inst.settings.offset && !inst.states.loading) {
                inst.states.loading = TRUE;

                if (inst.settings.autoLoad && (!inst.settings.autoLoadUntil 
  || inst.settings.autoLoadUntil > inst.page)) {
                    self._loadInfiniteScroll.call(self, target);
                } else {
                    self._moreInfiniteScroll.call(self, target, 'show');
                }
            }
        }).on("click.scroll", "." + inst.settings.loadMoreClass, function (e) {
            if (e && e.preventDefault) {
                e.preventDefault();
            }

            self._loadInfiniteScroll.call(self, target);

            return false;
        }).on("scrollcomplete", function (event, ui) {
            if (inst.settings.complete !== null) {
                inst.settings.complete.call(target, event, ui);
            }
        });

        $.data(target, PROP_NAME, inst);
    },
    _moreInfiniteScroll: function (target, action) {
        var inst = this._getInst(target);
        if (!inst) {
            return;
        }

        var $wrapper = inst.container.find("." + 
  inst.settings.loadMoreWrapperClass);

        switch (action) {
        case 'show':
            if ($wrapper.length === 0) {
                $('<div class="' + inst.settings.loadMoreWrapperClass + '"><a href="#" class="' + inst.settings.loadMoreClass + '">' + inst.settings.loadMoreText + '</a></div>').appendTo(inst.container.is(document) ? document.body : inst.container);
            }
            break;
        case 'hide':
            if ($wrapper.length > 0) {
                $wrapper.remove();
            }
            break;
        }
    },
    _indicatorInfiniteScroll: function (target, action) {
        var inst = this._getInst(target);
        if (!inst) {
            return;
        }

        var $wrapper = inst.container.find("." + inst.settings.indicatorWrapperClass);

        switch (action) {
        case 'show':
            if ($wrapper.length === 0) {
                $('<div class="' + inst.settings.indicatorWrapperClass + '" style="background: url(' + inst.settings.loadingIcon + ') center center no-repeat;"></div>').appendTo(inst.container.is(document) ? document.body : inst.container);
            }
            break;
        case 'hide':
            if ($wrapper.length > 0) {
                $wrapper.remove();
            }
            break;
        }
    },
    _loadInfiniteScroll: function (target) {
        var inst = this._getInst(target);
        if (!inst) {
            return;
        }

        var self = this;

        this._moreInfiniteScroll.call(this, target, 'hide');

        this._indicatorInfiniteScroll.call(this, target, 'show');

        inst.page += 1;

        $.ajax({
            url: inst.settings.url,
            cache: false,
            data: {
                page: inst.page
            }
        }).done(function (data) {
            if (inst.container.is(document)) {
                $(document.body).append(data);
            } else {
                inst.container.append(data);
            }

            self._indicatorInfiniteScroll.call(self, target, 'hide');

            inst.states.loading = FALSE;

            inst.container.trigger("scrollcomplete", {});
        });
    },
    _destroyInfiniteScroll: function (target) {
        var inst = this._getInst(target);
        if (!inst) {
            return FALSE;
        }
        $(target)
            .off("scrollcomplete")
            .off(".scroll")
            .find("." + inst.settings.loadMoreWrapperClass).remove().end()
            .find("." + inst.settings.indicatorWrapperClass).remove();

        if (inst.container.is(document)) {
            $(window).unbind(".scroll");
        }

        $.data(target, PROP_NAME, FALSE);
    },
    _newInst: function(target) {
        return {
            container: target,
            uid: Math.floor(Math.random() * 99999999),
            page: 0,
            settings: {},
            states: {
                loading: false
            }
        };
    },
    _getInst: function(target) {
        try {
            return $.data(target, PROP_NAME);
        } catch (err) {
            throw 'Missing instance data for this infinite scroll';
        }
    },
});

$.fn.pjInfiniteScroll = function (options) {
    var otherArgs = Array.prototype.slice.call(arguments, 1);
    if (typeof options == 'string' && options == 'isDisabled') {
        return $.pjInfiniteScroll['_' + options + 'InfiniteScroll'].apply($.pjInfiniteScroll, [this[0]].concat(otherArgs));
    }

    if (options == 'option' && arguments.length == 2 && typeof arguments[1] == 'string') {
        return $.pjInfiniteScroll['_' + options + 'InfiniteScroll'].apply($.pjInfiniteScroll, [this[0]].concat(otherArgs));
    }

    return this.each(function() {
        typeof options == 'string' ? $.pjInfiniteScroll['_' + options + 'InfiniteScroll'].apply($.pjInfiniteScroll, [this].concat(otherArgs)) : $.pjInfiniteScroll._attachInfiniteScroll(this, options);
    });
};

$.pjInfiniteScroll = new InfinteScroll();
$.pjInfiniteScroll.version = "1.0";

}）（jQuery的）;

Answer 1

在你的代码中，你使用的是无任何参数的无限滚动。

<script> $(function () { $(document).pjInfiniteScroll(); }); </script>

将此更改为此。设置url

<script>
$(function () {
  $(".container").pjInfiniteScroll({
    // set the id here in the url
    url: 'ajax.php?id=1'
  });
});
</script>

jquery-infinite-scroll（加载第二页时出错）

1 个答案: