一、实现效果:

为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数。

html & JS:

 <div>
<textarea name="content" id="content" onkeyup="javascript:checkWords(this);"
onmousedown="javascript:checkWords(this);" ></textarea>
</div>
<div>
还可以输入<span style="font-family: Georgia; font-size: 26px;" id="wordCheck">80</span>个汉字
</div> <script>
var maxstrlen=80;
function Q(s){
return document.getElementById(s);
}
function checkWords(c){
len=maxstrlen;
var str = c.value;
myLen = getStrleng(str);
var wck=Q("wordCheck");
if(myLen>len*2){
c.value=str.substring(0,i+1);
}else{
wck.innerHTML = Math.floor((len*2-myLen)/2);
}
}
function getStrleng(str){
myLen = 0;
i = 0;
for(;(i<str.length)&&(myLen<=maxstrlen*2);i++){
if(str.charCodeAt(i)>0&&str.charCodeAt(i)<128)
myLen++;
else
myLen+=2;
}
return myLen;
} 以上可以动态判断文本框可输入剩余字数,资料来自网络。

JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)的更多相关文章

  1. C# 使用js正则表达式,让文本框只能输入数字和字母,最大长度5位

    使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...

  2. js使用正则表达式实现文本框只能输入数字和小数点

    第一种情况:且限制小数点前最大3位数,小数点后最大3为三位 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...

  3. js验证如何限制文本框只能输入数字

    s限制只能数字输入,并且在把输入的“非法字符”清除掉之后将焦点停留在输入非法字符的位置,参考如下:html部分:<input value="" type="text ...

  4. JQuery+AJAX实现搜索文本框的输入提示功能

    平时使用谷歌搜索的时候发现只要在文本框里输入部分单词或字母,下面马上会弹出一个相关信息的内容框可供选择.感觉这个功能有较好的用户体验,所以也想在自己的网站上加上这种输入提示框. 实现的原理其实很简单, ...

  5. js控制文本框只能输入中文、英文、数字与指定特殊符号.

    先在'' 里输入 onkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的 X换成你想输入的代码就可以了, 中文u4 ...

  6. js限制文本框只能输入数字方法小结(转)

    这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下   有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...

  7. Jquery / js 判断数据类型方法(限制文本框类型输入)

    当想要判断文本框中的值是否为自己想要的类型时,可以通过一些方法作出判断,这里对于光标离开文本框时判断文本框中输入的是否是数值类型,如果不是,做出提示 $("#WORKYEARS") ...

  8. js限制文本框只能输入整数或者带小数点[转]

    这篇文章是关于js限制文本框只能输入整数或者带小数点的内容,以下就是该内容的详细介绍. 做表单验证的时候是否会碰到验证某个输入框内只能填写数字呢,仅允许输入整数数字或者带小数点的数字.下面这段代码也许 ...

  9. JS控制文本框textarea输入字数限制

    <html> <head> <title>JS限制Textarea文本域字符个数</title> <meta http-equiv="C ...

随机推荐

  1. ASP.net 中手工调用WS(POST方式)

    ASP.net 中手工调用WS(POST方式)核心代码:string strUrl="http://localhost:21695/service1.asmx/getmythmod" ...

  2. Oracle 常见函数

    1.把数字转换为字符串:To_char(数字) 2.Oracle 拼接字符串: || ':' || select  字段1 || ':' || 字段2 from  table  :字段1:字段2 3. ...

  3. 2016-11-02: boost::enable_shared_from_this

    使用场景 当类对象被shared_ptr管理时,需要在类自己定义的函数中把当前对象作为参数传递给其他函数时,必须传递一个shared_ptr,否则就不能保持shared_ptr管理这个类对象的语义.因 ...

  4. 常用linux维护命令

    cat /etc/issue  查看linux版本信息

  5. 块状元素(div)与内联元素(span)

    <pre class="html" name="code"><html xmlns="http://www.w3.org/1999/ ...

  6. Nginx的安装配置 例子

    1.下载 2.解压 3.运行 a.双击nginx.bat b.启动Nginx 会发现进程里面已经开始运行 4.配置 a.双击打开配置文件夹里面的nginx.conf b.修改 upstream tee ...

  7. 关于Java static 的学习心得

    static,大家都很熟悉.但是要说真的懂,那就很少了.(当然我也不是很懂,但不妨碍学习吗.) 首先,我认为static修饰的成员就是属于类本身的成员.如果你加了一个static修饰符,好吧,那就相当 ...

  8. Android常用客户端测试工具

    Emmagee GT iTest PowerTutor 网速限制 Root Explorer ApkEditor 陆续添加...

  9. Only MySqlParameter objects may be stored

    Only MySqlParameter objects may be stored 今天碰到了这个问题琢磨了半天,最后发现是MySql.Data.dll版本问题,换了个最新版本的就可以了.

  10. HTML标签拾遗

    在日常的开发过程中,经常与HTML标签打交道,常用的标签往往是那么几个,在此记录下后续可能会用到的html标签,或许会有意向不到的奇效.全部内容来自w3cschool. <abbr>   ...