jQuery实现还能输入N字符

页面:

<table cellpadding="0" cellspacing="0" border="0" width="100%">
                        <tr>
                            <td>
                                <textarea name="" id="doc" cols="30" rows="10"></textarea>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <div class="face">
                                    <img src="/sitecn/images/face.jpg" /></div>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                还能输入<span id="count"></span>字
                                <input type="button" class="btn" value="提 交" />
                            </td>
                        </tr>
                    </table>

JQuery:

<script type="text/javascript">
    var maxCount = 200;  // 最高字数,这个值可以自己配置

$("#doc").keyup(function () {
        var len = getStrLength(this.value);
        var lenCount = maxCount - len; //计算还可以输入多少个
        if (lenCount <0) {
            $(this).val($(this).val().substring(0, 200));
        }
        else {

$("#count").html(lenCount);
        }
    })

// 中文字符判断

function getStrLength(str) {

var len = str.length;

var reLen = 0;

for (var i = 0; i < len; i++) {

if (str.charCodeAt(i) < 27 || str.charCodeAt(i) > 126) {

// 全角

reLen += 2;

} else {
                reLen++;
            }
        }

return reLen;

}
</script>

时间: 2024-08-16 17:44:34

jQuery实现还能输入N字符的相关文章

ASP.NET 仿腾讯微博提示“还能输入*个字符”的实现

textbox如果设置TextMode="MultiLine"则 它的MaxLength设置的值就无效:为了能达到像腾讯微薄.新浪微薄那样的提示的效果(腾讯和新浪微薄文本框用到的应该是textarea),尝试如果不考虑用鼠标操作粘贴.删除textbox的内容,用jquery的keyup和keydown能实现,下面是实现的一个技巧,用到了js的计时器(当焦点在textbox中则“开启”计时器,失去焦点则“关闭”计时器),很好的解决了鼠标操作粘贴.删除textbox的内容不能改变字符个数的

Jquery 提示还可以输入的字数,将多余的字数截取掉

js代码: $(function () { var counter = $("#divform textarea").val().length; //获取文本域的字符串长度 $("#gptu var").text(289 - counter); $(document).keyup(function () { var text = $("#divform textarea").val(); var counter = text.length; if

JavaScript中统计Textarea字数并提示还能输入的字符

<span style="font-size:18px;"><script language="javascript"> function countChar(textareaName,spanName) { document.getElementById(spanName).innerHTML = 140 - document.getElementById(textareaName).value.length; } </script&

textarea提示还能输入多少字

//搜集的网上资源 这个是判断字符的,如果是判断汉字,需要根据你网页的编码来计算. 如果是GBK\GB2312编码,2个字节=1个汉字 如果是unicode\utf-8编码,里面汉字是长度不是一定的,有的长.有的短,2-4=1个汉字 <textarea name="content" id="content" style="width:345px;height:120px;"></textarea><div id=&q

用jquery判断输入框还可以输入多少字

效果 全部代码,粘贴可用 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&

Jquery 限制文本框输入字数【转】

<script type="text/javascript" src="js/jquery.min.js" ></script> <div class="right"> <p> <textarea id="caseContent" name="caseContent" maxlength="200" class="area&

wordpress登录密码框明文显示最后一个输入的字符

wordpress登录密码框明文显示最后一个输入的字符 (function(a){a.fn.dPassword=function(c){var e={interval:200,duration:1000,replacement:"%u25CF",prefix:"password_",debug:false};var d=a.extend(e,c);var b=new Array();var f=new Array();a(this).each(function(){

文本框textarea实时提示还可以输入多少文字

<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=gbk" /><title>insert title</title><style type="text/css"></style></head><body>

在EditText中限制输入,自定义样式,监听输入的字符,自动换行

自动获取焦点 <!-- 添加:<requestFocus /> 会自动获取焦点 --> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:ems="10" android:gravity="center_horizontal" android:hint="自