Question

我需要在Html / javascript（或者php可能）中实现一个像twitter这样的脚本，当用户在字段中写入文本时，标签会发生变化，显示剩下的字符。

您能帮助我使用简单和简单脚本示例吗？

Answer 1

<script>
function checkCharCount(textfield){
    if(textfield.value.length > 300) textfield.value = textfield.value.substr(0, 300);
    document.getElementById("charCounter").innerHTML = 300 - textfield.value.length;
}
</script>

<textarea class="input" name="REMARK" rows="5" cols="45" maxlength="300" wrap="virtual" onKeyUp="checkCharCount(this);"></textarea> 
<div><span id="charCounter">300</span> characters left.</div>

Answer 2

Tim Down让我对使用鼠标而非键盘完成粘贴检测的方法感到好奇。在网上花了一个小时并且在测试页面上试错了我有这个RATHER SIMPLE但有效的跨浏览器[尽可能多]提供的解决方案，这在功能上满足我，但可能不满足javascript方法中的纯粹主义者。（嘿，只是想帮忙）

<head>
<script>
function checkCharCount(){
    textfield = document.getElementById('remark');
    //if(textfield.value.length > 300) // does not register length change until the next paste or keyup
    textfield.value = textfield.value.substr(0, 300);
    document.getElementById("charCounter").innerHTML = 300 - textfield.value.length;
}
</script>
</head>
<body>

<textarea id="remark" class="input" name="remark" rows="5" cols="45" wrap="virtual" onkeyup="checkCharCount();" onpaste="setTimeout(checkCharCount, 20);"></textarea> 
<div><span id="charCounter">300</span> characters left.</div>

</body>

请参阅http://www.quirksmode.org/dom/events/cutcopypaste.html上的参考和浏览器兼容性说明并以我的主观意见查看他们的演示页面，这是值得收藏的。

Answer 3

我会使用像this one这样的JQuery插件。使用PHP来实现它是可能的，但是会很好..错误。由于PHP在服务器上运行，因此每次keydown都必须向/从服务器发送/接收。 Javascript在客户端运行，因此不需要这个额外的有效负载。悬停您可以在PHP中指定最大值，在原始响应中将其发送到客户端，并在客户端javascript中使用它。

用户在文本框中写入时的动态文本限制（HTML）

3 个答案: