相关疑难解决方法(0)

我想要一个事件在用户滚动时加载更多内容并且几乎到达页面底部,比如从底部开始大约100px,问题是每次滚动页面的下部100px时事件都会被触发,因为显而易见的原因,这是一个不可能发生的明显问题,所以我想知道如何做到最好,我已经在这里检查了其他答案/问题,但是部分工作的一个解决方案并不符合我的需要要做,当我尝试改变它,它会,它每次完全冻结我的浏览器.这是一个问题: 检查用户是否已滚动到底部

我正在看的答案接近底部,但这是他建议的代码:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       $(window).unbind('scroll');
       alert("near bottom!");
   }
});

就像我说的那样,这确实有效,并且可以防止多个事件被触发,问题是我需要触发无数的事件,比如我到达底部时加载100行信息​​,但仍有1500多个,我需要它重复每次加载每一个信息量(一旦你到达页面的底部100px部分每次)

所以我试图做的是:

 function loadMore()
{
   alert("More loaded");
   $(window).bind('scroll');
 }

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       $(window).unbind('scroll');
       loadMore();
   }
});

就像我说的那样,每次都会立即冻结我的浏览器,绑定部分.

有没有办法使用Jquery找出页面结束,这样就可以显示一条简单的消息,说明你已到达页面的末尾.

我找到了经典的MDN 公式来检查内容是否已滚动到底部，

element.scrollHeight - element.scrollTop === element.clientHeight

不再适用于所有情况。例如，如果您将MDN 上的演示页面的内容比例更改为大于 100%，您将不会获得正确的结果。发生这种情况是因为现在浏览器在元素上使用亚像素精度。特别scrollTop是现在不是 100% 的比例是小数值。实际上，问题的发生是因为===上面公式中的符号。

那么最简单但仍然可靠的解决方案是什么？

一旦它触及底部,那么有一个回调函数？

有没有办法衡量用户何时滚动到元素的底部？我知道jQuery可以访问scrollTop()一个元素,但即使将它与元素的高度相结合,我也无法计算元素何时滚动到最底部位置.我想这样做,所以当在textarea中滚动时,我可以防止文档的主体在达到textarea的"滚动底部"时滚动.

JSBIN

你好，我需要什么时候$(window)用100%警报向下滚动，我该怎么做？

我正在研究一个jQuery函数,它在点击时滚动到div.现在它将滚动到顶部,我想知道它们是否是一种方法使其滚动到中心$('.scrollit')而不是顶部,或者可能是一种方法来将其偏移一些像素数量？

$(".playbox").on('click', function () {
    $('.scrollit').animate({
        scrollTop: $(this).offset().top
    }, 1000);

我有一个大的列表,我想加载它,因为用户向下滚动选择字段,但我怎么能在mat-select中获得滚动事件,没有事件触发滚动事件.

<mat-form-field>
  <mat-select placeholder="Choose a Doctor" formControlName="selectedDoc" (change)="drSelected()">
    <div *ngFor="let dr of doctors;let i = index" [matTooltip]="getDocDetail(i)" matTooltipPosition="right">
      <mat-option (scroll)="docScroll()" [value]="dr">
        {{dr.name}}
      </mat-option>
    </div>
  </mat-select>
  <mat-hint>List Of Doctor In Your city</mat-hint>
  <mat-error *ngIf="selectedDoc.hasError('required')">Please Select A Dr</mat-error>
</mat-form-field>

(滚动)不工作,因为mat-select没有任何其他方式的滚动事件我可以实现这一点我想首先显示10项目然后当用户滚动选项时填充其余项目.

我试图在用户向下滚动并到达页面底部时触发一个事件。

我在互联网上搜索并在 stackoverflow 中找到了一些帖子，但出乎意料的是，答案对我不起作用。

例如：检查用户是否滚动到底部

使用上述 SO 帖子给出的答案，我尝试触发的事件在到达页面顶部而不是底部时执行。

如果我出错了，请告诉我：

$(window).scroll(function() {
if($(window).scrollTop() + $(window).height() == $(document).height()) {
   loadmore();
}
});

function loadmore(){

var lastProd = $('.product_div').last(); 
var lastProdID = $('.product_div').last().prop('id'); 
//console.info(lastProdID); return false;
//var val = document.getElementById("row_no").value;
$.ajax({
    type: 'post',
    url: 'includes/load_products.php',
    data: { getresult:lastProdID },
    success: function (response) {
        console.log(response);
        //var content = document.getElementById("all_rows");
        //content.innerHTML = content.innerHTML+response;
        lastProd.after(response);

        // We increase the value by 10 because we limit the results by 10
        // document.getElementById("row_no").value = Number(val)+10;
    }
}); …

在我的jquery中,我试图计算滚动条从底部是100px的时间,当它到达那里时我会做一个ajax查询(现在我正在做一个警报,你可以看到).

$(document).on("scroll", function(e){
    var scrollHeight = $(document).height();
    var offset = $(document).scrollTop();
    console.log(scrollHeight);
    console.log(offset);
    if(scrollHeight - offset <= 100){
        alert("here");
    }
});

由于某种原因,我无法弄清楚它是行不通的.如果我滚动到底部,我会认为它height()会相等,scrollTop()但它没有,这是它显示的内容:

scrollHeight = 1923
offset = 998

我使用错误的方法吗？