输入scrollLeft从不更改IE11 | 输入scrollLeft从不更改IE11

本文介绍了输入scrollLeft从不更改IE11的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我不确定我是要发疯还是这是IE11中的错误.

I'm not sure if I'm going crazy or if this is a bug in IE11.

在IE11中打开此演示: http://jsfiddle.net/zdfubscf/1/

var $span = $('span');
$('input').on('keyup', function () {
    $span.html(
        this.scrollLeft + ', ' +
        this.scrollWidth + ', ' +
        this.selectionEnd
    );
});

开始输入输入内容.

Start typing in the input.

<!DOCTYPE html>的设置正确.我缺少某些东西来获取正确的滚动值吗?

The <!DOCTYPE html> is set properly. Is there something I'm missing to get the proper scroll values?

推荐答案

似乎，仅IE的"TextRange"对象(在Edge中已弃用)可以帮助IE 11:

Seems, IE only "TextRange" object (deprecated in Edge) can help with IE 11:

var getScrollLeftAndScrollWidth = function (inputElement) {
  var range = inputElement.createTextRange();
  var inputStyle = window.getComputedStyle(inputElement, undefined);
  var paddingLeft = parseFloat(inputStyle.paddingLeft);
  var paddingRight = parseFloat(inputStyle.paddingRight);
  var rangeRect = range.getBoundingClientRect();
  var scrollLeft = inputElement.getBoundingClientRect().left + inputElement.clientLeft + paddingLeft - rangeRect.left;
  var scrollWidth = Math.max(inputElement.clientWidth, paddingLeft + (rangeRect.right - rangeRect.left) + paddingRight);
  return {scrollLeft: scrollLeft, scrollWidth: scrollWidth};
};

这篇关于输入scrollLeft从不更改IE11的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！