0

所以我在一个搜索页面上工作,其中有一个块,显示列表中的下 10 个项目。我想做的是在到达列表末尾时隐藏此块。

function loadMore() {
    //Load the content
    var urlPortion = searchQuery.split("?");
    var urlString = "?hits=10&offset=";
    var offset = 0;
    var pageCounter = 1;

    $(".box-footer").click(function () {
        offset += 10;
        pageCounter++;
        var urlBuilder = urlPortion[0] + urlString + offset + "&" + urlPortion[1];

        $.get(urlBuilder, function (data) {
            var content = $(".search-result-list li", data);
            $('.search-result-list').append(content);
        });
    });

    //Visibility of "Show more"-bar
    var textString = $(".search-result-totalhits").html();
    var totalHitsString = /\d+/;
    var totalHits = textString.match(totalHitsString);
    var numberOfPages = (Math.ceil(totalHits/10));

    if ((totalHits > 10) && (pageCounter < numberOfPages)) {
        $(".p-sok .box-footer").show();
    }
    else {
        $(".p-sok .box-footer").hide();
    }
};

我的问题是,实际检查是否显示块的最后一个条件始终保持为真。我猜变量“pageCounter”在上面的点击函数之外不可用,但我不确定。我试图在第 18 行将变量输出到控制台,但它没有输出任何内容。

有人愿意给我一些提示吗?

4

1 回答 1

0

您是正确的,您遇到了变量范围的问题。click 事件的回调在不同的上下文中调用,然后是 LoadMore 函数。LoadMore 只是你声明它的地方,而不是它实际运行的地方。如果您希望能够在回调函数和 LoadMore 中访问变量,则需要将 pageCounter 声明为 LoadMore 函数之外的全局变量。所以像:

var pageCounter = 1;

function loadMore() {
    //Load the content

也就是说,我实际上认为您想将“//“显示更多”-bar 的可见性之后的所有内容移动到单击处理程序中。我这么说是因为您想根据您在列表中的当前位置显示或隐藏标题。每次点击都会更新,对吧?如果是这样,请尝试以下操作:

var pageCounter = 1;

function loadMore() {
    //Load the content
    var urlPortion = searchQuery.split("?");
    var urlString = "?hits=10&offset=";
    var offset = 0;

    $(".box-footer").click(function () {
        offset += 10;
        pageCounter++;
        var urlBuilder = urlPortion[0] + urlString + offset + "&" + urlPortion[1];

        $.get(urlBuilder, function (data) {
            var content = $(".search-result-list li", data);
            $('.search-result-list').append(content);
        });

       //Visibility of "Show more"-bar
       var textString = $(".search-result-totalhits").html();
       var totalHitsString = /\d+/;
       var totalHits = textString.match(totalHitsString);
       var numberOfPages = (Math.ceil(totalHits/10));

       if ((totalHits > 10) && (pageCounter < numberOfPages)) {
           $(".p-sok .box-footer").show();
       }
       else {
           $(".p-sok .box-footer").hide();
       }
    });
};
于 2013-01-31T15:50:30.307 回答