JS怎么实现输入框随文字数量而改变宽度

Question

用 canvas 作一个截图，鼠标拖动可以画出虚线框，并且可以在虚线框里输入文字。输入框随文字数量改变宽度。类似QQ截图里的输入框。

现在虚线框里我用的是input，但是input不能换行。然后我改用textarea输入文字，但是会出现滚动条，要是把滚动条hidden了的话，输入的文字就看不全，体验不好。

Answer 1

现在上层放一个正常的输入框，等确定之后，在渲染到canvas上，在此期间，要记录用户输入的坐标位置，以便还原

Answer 2

canvas measureText 方法可以事先获取文字画出来的长度 根据这个长度 你可以动态改变宽度 以及位置去在canvas显示 如果是改变input的长度 你可以用相同的字体样式 写入一个div 去获取div的长度 来动态改变input

Answer 3

滚动条隐藏 ？？？ 看不全 ？？ 。只是隐藏 又不是 overflow：hidden。

Answer 4

给他家个时间，当输入或者 值改变 或者 焦点的时候，获取输入框的滚动条的宽度，使这个宽度 设置输入框的 width。