Javascript中的ScrollTo（）向下滚动(ScrollTo() in Javascript scrolls all down)

Javascript中的ScrollTo（）向下滚动(ScrollTo() in Javascript scrolls all down)

在我的HTML文档中，我有一个输入字段。 您可以输入一个数字，窗口应向下滚动到此像素数。

我使用了scrollTo()函数。 问题是，它总是滚动到页面的底部。

如果我输入window.scrollTo(0, 500 + 400); 它运行正常，但是使用window.scrollTo(0, document.getElementById("field").value + 400); 它总是向下滚动。

您可以在这个小提琴中看到问题： https ： //jsfiddle.net/ultraphilipp/eusq986j/

谢谢你的帮助！ :)

In my HTML Document I've got a input field. You can give in a number and the window should scroll down to this pixel number.

I've used the scrollTo() function. The thing is, that it always scrolls to the bottom of the page.

If I type window.scrollTo(0, 500 + 400); it works fine, but with window.scrollTo(0, document.getElementById("field").value + 400); it always scrolls all the way down.

You can see the problem in this fiddle: https://jsfiddle.net/ultraphilipp/eusq986j/

Thanks for your help! :)

最满意答案

有两个问题：

首先，您使用了错误的字段ID。 请改用“深度”。

第二个问题是

document.getElementById("depth").value

返回一个字符串

假设您输入数字5。

它的作用是“5”+ 400 = 5400

要解决此问题，您必须将值转换为整数

window.scrollTo(0, parseInt(document.getElementById("depth").value) + 400);

应该解决你的问题。

There are 2 problems:

First you're using the wrong field ID. Use 'depth' instead.

The second problem is that

document.getElementById("depth").value

returns a string

Let's say you input the number 5.

What it does, is "5" + 400 = 5400

To fix this, you have to convert the value to an integer

window.scrollTo(0, parseInt(document.getElementById("depth").value) + 400);

Should fix your problem.