Question

我有一个部分视图，它返回HTML表格中的大量数据。我已经使用jquery here实现了无限滚动技术，以便在向下滚动时加载表格。当我从视图渲染局部视图时，一切都按预期工作。但滚动是在页面级别。我想只在部分视图表周围滚动条。问题是当我在局部视图周围放置一个标签来设置滚动时，它不会检测滚动到底部的时间。

我为iframe here看到了这个实现，但我需要它来进行局部视图。

视图只有表格标题和一些文本，然后调用下面的局部视图。

<div style="height: 400px; width: 600px; overflow: auto;">
        <div id="loading"></div>   
        <div id="productList">            
                @Html.Partial("_PartialViewName")            
        </div>  
</div>

这些是javascripts。如何设置.scroll函数以检测局部视图中的滚动？

function loadProducts() {
        if (page > -1 && !_inCallback) {
            _inCallback = true;
            page++;
            $('div#loading').html('<p><img src="/Content/Images/ajax-loader.gif"></p>');
            $.get("/Users/Index/" + page, function (data) {
                if (data != '') {
                    $("#productList").append(data);
                }
                else {
                    page = -1;
                }

                _inCallback = false;
                $('div#loading').empty();
            });
        }
    }


    $(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {

            loadProducts();
        }
    });

Answer 1

也许，您需要更改滚动功能。您是否尝试使用'#productList'更改'window'？我现在不能尝试，对不起，这只是一个想法。

编辑：Here是我在jsfiddle中找到的一个例子。希望这会对你有所帮助。

$(".box").scroll(function() {
    if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
        $("span").show();    
    } else {
        $("span").hide();
    }
});

编辑2：我发现我的答案不正确：你正试图捕捉窗口中的滚动。您需要使用overflow：auto ...

捕获div中的滚动

HTML

<div id="overflowdiv" style="height: 400px; width: 600px; overflow: auto;">
        <div id="loading"></div>   
        <div id="productList">

JS

    $("#overflowdiv").scroll(function () {
        console.debug("scroll activado!");
        console.debug($(this).scrollTop() + $(this).innerHeight() + " " + $(this)[0].scrollHeight);

        if( $(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
            loadProducts();
        }
    });

这对我来说很好。

检测到MVC 5应用程序

1 个答案: