Question

我有一种感觉，曾经给我的问题，我试图在这个问题中找到解决方案 - Can't trigger a jquery function with scroll on a particular div - 可能会在这里负责滚动相关问题。

简短版本：无法使用此功能或其他类似工具

$("#Container3").scrollTop(0);

没有任何事情发生，控制台没有错误，没有奇怪的行为，似乎忽略了scrollTop（0）请求。

长版本：对不起，但是发布代码片段是不可行的，因为它是一个复杂的应用程序界面，但我会尽力解释这个问题：

移动响应式网站，根据屏幕不动产加载不同的界面。
最小的界面由3部分组成 - 顶部导航，底部搜索和中间内容。
内容主要在使用期间加载，而不是在页面加载时加载。
按下一个重新加载特定div内容的按钮，我还需要将该div滚动到顶部以便于实用。
虽然它似乎没有影响我的问题（删除它不能解决问题）但我应该透露我正在使用hammer.js来模拟触摸事件，因为它可能会影响解决方案。

加载在视口外部完成，因此不需要动画，但只要他们能够使用动画，我就会接受动画。

这是我的jquery请求的样子

$(document).on("click",".NavRowButton",function(event){
    $("#Container3").scrollTop(0);
    var $targetButtonId=$(event.target).attr("id");
    $("#Content").load("/load/login/"+$targetButtonId+".php");
    $("#DisplayContentName").html("<span class='NavColSpan'>"+$targetButtonId+"</span>");
    $("#Container3").find(".WindowBorder").css("top","0");
});

#Container3有滚动条，是#Content的直接父。

这是我正在构建的一个函数，它是我之前遇到的问题的解决方案，也是我现在用来帮助调试这个问题的解决方案：

document.addEventListener('scroll',function(event){
    if(event.target.className==='Container'){
        var $currentScroll=$(event.target).scrollTop();
        console.log($currentScroll);
        var $targetId=$(event.target).attr("id");
        console.log($targetId);
    }
},true);

提前致谢。

编辑：我刚注意到，如果我放一个$（event.target）.scrollTop（0）;在滚动距离调试功能结束时，它实际上会重置滚动，所以只要div是event.target它就可以在外部工作，因为在点击功能期间我可能无法正确选择它。

Edit2：我刚学会了我可以将event.targets缓存到变量中，并在click函数中使用.get（）我确定我选择了正确的元素，所以它只是留下了scrollTop（0）方法有效。

它们现在看起来像这样（还必须添加条件来限制加载事件）：

全局变量：

$DivTestVar="";

点击：

$(document).on("click",".NavRowButton",function(event){
    var $targetButtonId=event.target.id;
    if($targetButtonId != $("#DisplayContentName").html()){
        $($DivTestVar).scrollTop(0);
        console.log($($DivTestVar).get());
        $("#Content").load("/load/login/"+$targetButtonId+".php");
        $("#DisplayContentName").html($targetButtonId);
        $("#Container3").find(".WindowBorder").css("top","0");
    };
});

滚动调试：

document.addEventListener('scroll',function(event){
    if(event.target.className==='Container'){
        $DivTestVar=event.target;
        var $currentScroll=$($DivTestVar).scrollTop();
        console.log($currentScroll);
        var $targetId=event.target.id;
        console.log($targetId);
    }
},true);

如果我在滚动console.log之前单击（$（$ DivTestVar）.get（））;返回空，但如果在第一次滚动时它开始返回正确的DOM元素。无论如何，scrollTop（0）都会被忽略。

编辑3：我只想留下一个小小的更新。我已经放弃了我试图在这里用于具有类似效果但不像我想要实现的用户友好的方法的方法。因此我不再关心这个问题，但是如果你正在阅读这篇文章并遇到类似的问题，那么我会多次遇到这个问题，效果会更小，我现在认为它与位置相关：固定;元素以及scrollTop（）如何处理它，但我没有时间深入研究它更好运和神速。

Answer 1

您是否尝试过纯JS版本？

document.getElementById('Container').scrollTop = 0

Answer 2

据我所知，你有两种可能性。

1 - 滚动整个页面，直到它使用jQuery到达#Content div位置的顶部。

2 - 您的#Content位于带有滚动条的div中，scrollTop(0)将对其有用（例如：http://jsfiddle.net/zkp07abu/）。

.scrollTop（0）无法使div滚动到顶部

2 个答案: