Javascript：根据文本调整输入字段宽度

Question

我正在尝试根据此解决方案实现自动调整大小的文本字段 question

<input style="width:20px;" onkeypress="this.style.width = ((this.value.length + 1) * 5) + 'px';"  ng-model="questionButtons[$index].title" type="text" class="edt_spn active" >

它工作正常但是当用户删除字符时宽度没有调整

＆＃13;

＆＃13;

<input style="width:20px;" onkeypress="this.style.width = ((this.value.length + 1) * 5) + 'px';"  ng-model="questionButtons[$index].title" type="text" class="edt_spn active" >

＆＃13;

＆＃13;

＆＃13;

Answer 1

尝试onkeyup事件。

<input style="width:20px;" onkeyup="this.style.width = ((this.value.length + 1) * 5) + 'px';console.log(this.value.length);"  ng-model="questionButtons[$index].title" type="text" class="edt_spn active" >

Answer 2

我认为最好的变体是使用oninput事件。

来自MDN：

  

当＆lt; input＆gt;，＆lt; select＆gt;或＆lt; textarea＆gt;的值同时触发DOM输入事件元素改变了。

<input style="width:20px;"  oninput="this.style.width = ((this.value.length + 1) * 5) + 'px';"  ng-model="questionButtons[$index].title" type="text" class="edt_spn active" >