问题描述
我有一个 textbox，用户可以在其中输入任意数量的字符，但我希望它的 宽度根据输入的字符数动态增加.
I have a textbox where the user can enter any number of characters, But I want its width to be increased dynamically with respect to the number of characters entered into it.
我已经完成了如下所示的解决方法，它可以部分工作，它会动态增加宽度但不是那么精确，并且会在一段时间后隐藏第一个输入的字符，因为我在其中应用了糟糕的逻辑.我刚刚给出了 17 个字符的狂野截止值来开始增量.
I have done a workaround shown below and it works partially, it will increase the width dynamically but not so precisely and will hide the first entered characters after a while because of my poor logic applied in it. I've just given a wild cutoff of 17 characters count to start the increment.
只有在字符数达到文本框末尾时才开始增加宽度.
更新:
我希望显示在该字段中输入的所有字符，而默认情况下，文本框会隐藏最左边的字符.
FIDDLE 演示
HTML
<input type="text" id="txtbox" />
脚本
$('#txtbox').keypress(function() {
var txtWidth = $(this).width();
var cs = $(this).val().length;
if(cs>17){
$(this).width(txtWidth+5);
}
});
推荐答案
我已经尝试过这段代码，它运行良好.
I have tried this code and it works fine.
<html>
<head>
<script type="text/javascript">
function Expand(obj){
if (!obj.savesize) obj.savesize=obj.size;
obj.size=Math.max(obj.savesize,obj.value.length);
}
</script>
</head>
<body>
<form>
<input type="text" size="5" style="font-family:Courier;" onkeyup="Expand(this);">
</form>
</body>
</html>
请务必在文本框中使用单空间字体，否则大小 attr.并且字符数不匹配
Be sure to use mono space fonts in text box, otherwise the size attr. and number of characters won't match
这篇关于根据输入的字符动态增加输入类型文本文本框的宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
大气响应式网络建站服务公司织梦模板
高端大气html5设计公司网站源码
织梦dede网页模板下载素材销售下载站平台（带会员中心带筛选）
财税代理公司注册代理记账网站织梦模板（带手机端）
成人高考自考在职研究生教育机构网站源码(带手机端)
高端HTML5响应式企业集团通用类网站织梦模板(自适应手机端)