如何使用javaScript或jquery获取文本输入内容宽度

我有一个

标签

它可能有太多的内容，当内容长度超过输入宽度时，它将水平滚动

事实上，我想控制标签的宽度，使其根据内容而变化

那么，有没有办法获得标签的内容宽度？与“滚动高度”属性类似？

检查此项

$.fn.textWidth=函数（文本，字体）{
如果（！$.fn.textWidth.fakeEl）$.fn.textWidth.fakeEl=$（''）.hide（）.appendTo（document.body）；
$.fn.textWidth.fakel.text（text | | this.val（）| | | this.text（））.css（'font'，font | | this.css（'font'））；
返回$.fn.textWidth.fakeEl.width（）；
};

您可以在（'input'，function（）{}）上使用

$（“#chkText”）.on（'input'，function（）{}）如下所示



$（文档）.ready（函数（）{
$（“#chkText”）.on（'input'，function（）{
var lng=$（“#chkText”）.val（）.length；
$（“#chkText”）.宽度（液化天然气*10）；
});
});

HTML

尝试调整onkeypes或onkeypup的长度：

一个onkeypress示例。
onkeypress=“this.style.width=（（this.value.length+1）*5）+'px'

如果你把它放在输入标签里，它应该可以工作。我认为最好定义最小/最大宽度。
谢谢！准确测量的好策略！帮了我大忙！很高兴你成功了：）我只是在想怎么做，你完全做到了。干得好
$.fn.textWidth = function(text, font) {
    if (!$.fn.textWidth.fakeEl) $.fn.textWidth.fakeEl = $('<span>').hide().appendTo(document.body);
    $.fn.textWidth.fakeEl.text(text || this.val() || this.text()).css('font', font || this.css('font'));
    return $.fn.textWidth.fakeEl.width();
};

<script type="text/javascript">
    $(document).ready(function () {
        $("#chkText").on('input', function () {
            var lng = $("#chkText").val().length;
            $("#chkText").width(lng * 10);
        });
    });
</script>

<input type="text" id="chkText"/>