ajax查询后按值长度调整输入字段的大小答案

【问题标题】：Resize input field by value length after ajax queryajax查询后按值长度调整输入字段的大小
【发布时间】：2019-06-12 23:52:23
【问题描述】：

Javascript

// Ajax refresh price value.
setInterval(function() {
    $.ajax({
        url:"query.php?currency=<?=$currencycode;?>"
    }).done(function(data) {
        $("#value").attr("value", data);
    });
},3000);

HTML

<input id="value" type="text" value="..." size="1" readonly>

query.php 文件输出

如何使输入字段大小更改为 query.php 文件输出结果长度，在我的情况下为 1234，输入标记的大小应为 4。还有一个过渡动画，以查看每次刷新的更改，在我的每 3 秒处理一次。

【问题讨论】：

标签： java html ajax

【解决方案1】：

试试这个

// Ajax refresh price value.
setInterval(function() {
    $.ajax({
        url:"query.php?currency=<?=$currencycode;?>"
    }).done(function(data) {
        $("#value").attr("value", data).attr("size", data.length);
    });
}, 3000);

【讨论】：

是的，这行得通，我添加了这行额外的代码：.attr("size", data.length);
太棒了！您还谈到了过渡动画，您能否更具体地说明您想用它实现什么或标记答案:)

【解决方案2】：

使用这段代码，一个例子：

<input id="counter" type="text" value="1234" size="7" readonly>
<script>
let init="1234";
let i = 5;
setInterval(function() {
     document.getElementById("counter").value=init;
     document.getElementById("counter").size=init.length + 4;
     init += i;
     i++;
},1000);
</script>

【讨论】：