我在网上看到了这种能力，但我不太确定如何搜索它，一个很好的例子是发送一条短信，它会在你输入时说：
132/160 - 132 计数器会增加，直到你达到极限。
我的问题是是否可以单独使用 javascript，而不使用 jQuery 库？但是，如果我必须使用 jQuery，我会使用 jQuery，也许可以指向一个好的教程，或者它可能比这更简单，甚至可以使用一些术语来搜索它，谢谢。
【问题讨论】：
标签： javascript jquery live validation
在受支持的情况下使用oninput 事件（所有现代浏览器、IE 9 及更高版本），在旧版 Internet Explorer 上使用onpropertychange：
var myInput = document.getElementById("myInput");
if ("onpropertychange" in myInput && !("oninput" in myInput)) {
myInput.onpropertychange = function () {
if (event.propertyName == "value")
inputChanged.call(this, event);
}
}
else
myInput.oninput = inputChanged;
function inputChanged () {
// Check the length here, e.g. this.value.length
}
onkeyup 不是处理输入的合适事件，因为在用户输入文本和您的代码注意到更改之间存在明显的延迟。用户甚至可以按住该键（用于在 Windows 设备上重复文本），但您的代码无法处理它。
【讨论】：
oninput 看起来很不错。
<!--This is your input box. onkeyup, call checkLen(...) -->
<input type="text" id="myText" maxlength="200" onkeyup="checkLen(this.value)">
<!--This is where the counter appears -->
<div id="counterDisplay">0 of 200</div>
<!--Javascript Code to count text length, and update the counter-->
<script type="text/javascript"><!--
function checkLen(val){
document.getElementById('counterDisplay').innerHTML = val.length + ' of 200';
}
//--></script>
【讨论】：
我想我已经为您的问题找到了准确的解决方案 countChar 函数接受一个文本框对象和一个 div 对象。 div 对象会显示剩余的字符数。
function countChar(txtBox,messageDiv)
{
try
{
count = txtBox.value.length;
if (count < 160)
{
charLeft = 160 - count;
txt = charLeft + " characters left...keep typing!!";
messageDiv.innerHTML="<font color=green>" + txt + "</font>";
}
else
{
messageDiv.innerHTML="<font color=red>Message is too long</font>";
}
}
catch ( e )
{
}
}
<INPUT type="text" id="txtMessage"
onkeyup="countChar(txtMessage,messagesuccess);"
onkeydown="if(event.keyCode == 13){document.getElementById('btnSendTextMessage').click();}" >
【讨论】：
您需要挂钩文本框的onkeyup 事件。
然后您可以验证/检查文本框值的长度，并（如果您想向用户显示计数器）根据需要更新计数器显示。
【讨论】：
这是一个简单的解决方案。
假设你的html代码如下
<textarea onKeyPress='return count(this);'></textarea>
<input type="text" id="info" value="0/160" />
注意：输入/文本字段的 id 是 info。
你需要下面的javascript方法
function count(area){
var proceed = area.value.length < 160;
document.getElementById('info').value = area.value.length+"/160";
return proceed;
}
注意：方法中指定的文本字段的id，大小为160。
【讨论】：
此代码用于一般用途：
html:
<input type="text" name="noteTitle" id="noteTitle" maxlength="100" onkeyup="checkLength(this,'titleLength')" />
<div id="titleLength">100</div>
JS：
//take field (fieldToCheckMax), and its counterID(titleLength)
function checkLength(fieldToCheckMax,counterID){
//get the maxallowed for the input
maxAllowed=fieldToCheckMax.getAttribute('maxlength');
//save the affected counter in a variable
counterID=document.getElementById(counterID);
//change the value based on the max allowed, to switch between green and red
counterID.innerHTML=colorChanger();
//the color based checker, to decide is it red or green
function colorChanger(){
if(fieldToCheckMax.value.length < maxAllowed) {
counterID.style.color='green';
return maxAllowed-fieldToCheckMax.value.length;}
else {
counterID.style.color='red';
return maxAllowed-fieldToCheckMax.value.length;
}
}
}
【讨论】：
您所需要的只是一个按键处理程序，用于检查文本区域内的字符串长度。您还可以为 textarea 提供 maxlength 属性。
一旦您检测到字符串超过 160 个（或限制为 wateva）字符，您可以提供一个警告框，然后将字符串修剪到其前 160 个字符。
我不会提供代码和勺子喂你。在网络上很容易找到它。
【讨论】：