在 Javascript 中将长度动态显示为类型

Dynamically display length as type in Javascript

本文关键字：动态显示 类型 Javascript      更新时间：2023-09-26

所以我想在键入时动态显示长度，但不知道如何去做。它必须使用键入或删除的每个字母进行更新。例如"Iam"长度=3"ia"长度 = 2当然，我可以通过单击按钮或按回车键来静态执行此操作，但我希望在键入时发生这种情况。请帮忙

更新：

输入事件有点不完整，因此请改用 KeyUp 事件。

这是更新的jsfiddle。

谢谢，@robg，在评论中提醒我。

原答案：

可以在<input>或<textarea>元素上使用输入事件。与更改事件不同，当更改<input>或<textarea>元素的值时，DOM 输入事件将同步触发。

var input = document.querySelector('input');
var p = document.querySelector('p');
var i = 0;
input.addEventListener('input', function() {
  p.innerHTML = input.value.length;
})
<input/>
<p>The length of the value</p>

这是一个jsfiddle

使用 Jquery 的解决方案

使用此 HTML

<input/>
<div>
</div>

而这个Jquery。

$('input').on('keyup blur change paste',function(){
    $('div').html($(this).val().length);
});

这将处理键控、模糊、更改、粘贴等事件。这是工作 JsFiddle

相关文章：