JS实现动态提示文本框可输入剩余字数(类似发表微博数字提示)
一、实现效果:
为了更直观的体现用户在文本框输入文本时能看到自己输入了多少字,项目中需要通过判断提示文本框剩余可输入字数。
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实现动态提示文本框可输入剩余字数(类似发表微博数字提示)的更多相关文章
- C# 使用js正则表达式,让文本框只能输入数字和字母,最大长度5位
使用js正则表达式,让文本框只能输入数字和字母,最大长度5位,只需要加个onkeyup事件,即可简单实现 <asp:TextBox ID="txtBegin" runat=& ...
- js使用正则表达式实现文本框只能输入数字和小数点
第一种情况:且限制小数点前最大3位数,小数点后最大3为三位 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...
- js验证如何限制文本框只能输入数字
s限制只能数字输入,并且在把输入的“非法字符”清除掉之后将焦点停留在输入非法字符的位置,参考如下:html部分:<input value="" type="text ...
- JQuery+AJAX实现搜索文本框的输入提示功能
平时使用谷歌搜索的时候发现只要在文本框里输入部分单词或字母,下面马上会弹出一个相关信息的内容框可供选择.感觉这个功能有较好的用户体验,所以也想在自己的网站上加上这种输入提示框. 实现的原理其实很简单, ...
- js控制文本框只能输入中文、英文、数字与指定特殊符号.
先在'' 里输入 onkeyup="value=value.replace(/[^\X]/g,'')" 然后在(/[\X]/g,'')里的 X换成你想输入的代码就可以了, 中文u4 ...
- js限制文本框只能输入数字方法小结(转)
这篇文章主要分享下js代码限制文本框中只能输入数字的多个实例,学习下js控制文本框中输入数字的方法,需要的朋友可以参考下 有时需要限制文本框输入内容的类型,本节分享下正则表达式限制文本框只能输入数 ...
- Jquery / js 判断数据类型方法(限制文本框类型输入)
当想要判断文本框中的值是否为自己想要的类型时,可以通过一些方法作出判断,这里对于光标离开文本框时判断文本框中输入的是否是数值类型,如果不是,做出提示 $("#WORKYEARS") ...
- js限制文本框只能输入整数或者带小数点[转]
这篇文章是关于js限制文本框只能输入整数或者带小数点的内容,以下就是该内容的详细介绍. 做表单验证的时候是否会碰到验证某个输入框内只能填写数字呢,仅允许输入整数数字或者带小数点的数字.下面这段代码也许 ...
- JS控制文本框textarea输入字数限制
<html> <head> <title>JS限制Textarea文本域字符个数</title> <meta http-equiv="C ...
随机推荐
- 使用Servlet上传文件
使用浏览器向服务器上传文件其本质是打开了一个长连接并通过TCP方式传输数据.而需要的动作是客户端在表单中使用file域,并指定该file域的name值,然后在form中设定enctype的值为mult ...
- git将已经同步的某类文件加入忽略列表并同步
1> 添加.gitignore文件到根目录,并在文件中写入忽略文件的类型或具体路径,比如: *.zip 和 /RSGIS/SnowEffect/SnowEffect.pro.user 2> ...
- 关于android截图的一些方法
这里只记录一些链接,对于我的需求,只需要, public static String createScreenShot(View v) { //测试截屏功能 SimpleD ...
- 使用wcf服务捕捉到“POST http://yourIP/WCFService.svc 405 (Method Not Allowed) ”错误!
在程序中使用了一个wcf服务,调试时无任何问题(win7 64位,iis6.1),发布到部门服务器上没有问题(server2008 64位),但是部署到实际服务器上时(server2008 iis6. ...
- xcode-git笔记
git initgit add .vi .gitignore /*将代码区蓝色字体的内容*/git commit -m "初次建立"git remote add origin ht ...
- Hibernate中的数据库方言(Dialect)
在配置hibernate.cfg.xml时需指定使用数据库的方言: 例: <property name="dialect">org.hibernate.dialect. ...
- SqlServer Where后面Case When语句的写法
select * from tb where (case when col='***' then '***' else '***' end)='***'
- java jvm常用命令工具
[尊重原创文章出自:http://www.chepoo.com/java-jvm-command-tools.html] 一.概述 程序运行中经常会遇到各种问题,定位问题时通常需要综合各种信息,如系统 ...
- 初识Promise
Promise对象 曾经用seajs开发后台管理的时候,矫情的PHPER非要JS内联到HTML文件中,方便他调用内容,还指定了jQueryFileUpload作为上传插件. 当时看到jQueryFil ...
- Python-lambda函数,map函数,filter函数
lambda函数主要理解: lambda 参数:操作(参数). lambda语句中,冒号前是参数,可以有多个,用逗号隔开,冒号右边的返回值.lambda语句构建的其实是一个函数对象 map函数: ma ...