javascript - 获取 IE/Edge Javascript 中的输入滚动位置(包括 JSFiddle)

标签 javascript internet-explorer input microsoft-edge scroll-position

场景: 当用户在输入字段中键入并且文本变得比字段宽度长时,文本会随着用户键入而滚动。
我依靠 scrollLeft 来获取输入字段上的滚动位置,我最近才意识到同样的代码在 IE 或 Edge 中不起作用(它在 Chrome、Firefox 和 Safari 中起作用)。

仔细观察,element.scrollLeft 与 IE/Edge 兼容,但无论出于何种原因,它在这些浏览器中只返回 0。我在 stackoverflow 上看到了另一个与我类似的问题,但似乎没有解决方法。

在 IE/Edge 中如何获取输入字段的滚动位置?

fiddle :https://jsfiddle.net/kellyag/bwac46yz/8/

function inputScrollPosition () {
  let input = document.getElementById('myInput');
  let scrollPosition = input.scrollLeft;

  console.log(scrollPosition)
};

最佳答案

我根据此处的讨论找到了解决方法:https://github.com/garysieling/jquery-highlighttextarea/issues/35

解决方法是改用文本区域(并将其样式设置为输入)。 当元素是文本区域时,element.scrollLeft 将起作用。

<textarea id="myInput" cols="50" rows="1" style="white-space: nowrap; overflow: hidden;"></textarea>

此版本仍需要一些额外的 css 样式,但代码可以正常工作: https://jsfiddle.net/kellyag/ywzus94m/2/

关于javascript - 获取 IE/Edge Javascript 中的输入滚动位置(包括 JSFiddle),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48330723/

相关文章:

c# - 表单打开时允许输入设置货币的文本框

javascript - 进入和离开时reactjs背景颜色过渡

javascript - 从 javascript 从 gridView 获取值

javascript - Typescript 类在其他类中不可见

html - IE7 <li> 元素符号或数字显示在 div 之外

javascript - window.open 仅在 IE 中导致错误

css - 有条件的 IE 评论在 Joomla 中不起作用

Python <函数函数名称位于 0x00000000>

javascript - 使用闭包具有相同行高的多个表

javascript - `#` 的一致 keyCode