Question

我有一个从左到右自动滚动的div。我使用jQuery来实现这一点。在jQuery回调函数中，我调用了使其从左向右自动滚动的函数。但是，回调函数失败，它不会再次从左向右滚动。我做错了什么？

function scroll() {
	
    var element = document.getElementById("scroll");
    var width = element.scrollWidth;
	
    $(document).ready(function(){

	$("#scroll").animate({scrollLeft: width}, 5000, function(){ 
	scroll();
	});
    });
	
} //end of scroll()	
	
scroll();

#scroll {
    display: inline-block;
    padding: .5%;
    border: 1px solid black;
    white-space: nowrap;
    width: 10%;	
    overflow-x: hidden;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "scroll">one two three four five six seven eight nine ten</div>

Answer 1

我认为这是由于“最大调用堆栈大小超出错误”

由于你正在调用scroll，而scroll又调用了scroll等，它会达到堆栈限制。

请参阅此答案，了解如何使用基本案例的递归函数 Maximum call stack size exceeded error

更新：这是由于scrollLeft的操作将元素向左滚动，需要在再次调用之前滚动回0。

自动滚动在回调功能上失败

1 个答案: