Question

我有一个输入，可以在值超出输入宽度时调整字体大小。这在Firefox或Chrome中完美运行，但在IE中则不然。我已经远距离搜索了，看起来IE有滚动宽度问题;它总是返回相同的值。

我如何在IE中完成这项工作。 http://jsfiddle.net/BelgoCanadian/k1xpnvxL/ 请使用Chrome或Firefox查看它是否有效。

function autoSize() {
    var defaultFont = 20
    var tbx = $('#textbox')
    //Parsing necessary to get rid of "px"
    var fontSize = parseFloat(tbx.css("font-size").substring(0,  tbx.css("font-size").length - 2))
    //While loop to decrease font until it fits in the textbox
    while (tbx[0].scrollWidth > tbx[0].clientWidth) {
      fontSize = fontSize - 1;
      tbx.css("font-size", fontSize + 'px')
    }
    //While loop to increase font back to default font size
    while (tbx[0].scrollWidth === tbx[0].clientWidth && fontSize < defaultFont) {
      fontSize = fontSize + 1;
      tbx.css("font-size", fontSize + 'px')
    }
 }

Answer 1

您可以使用名为scrollWidthPolyfill的东西修复IE / Edge scrollWidth问题。

我注意到它不是特别健壮 - 也就是说，当你在文档的头部加载脚本时，它会中断。所以将它附加到身体上，无论如何这是最好的做法。

但它有效。见this demo on JSBin。但是，您必须在自己的代码中解决一些问题，因为您将在IE中运行演示时看到。

ScrollWidth在IE中返回相同的值

1 个答案: