首页 > 其他 > 详细

微博发布框---2017-04-14

时间:2017-04-14 09:40:30      阅读:193      评论:0      收藏:0      [点我收藏+]

 

实现效果:

1、文本框输入内容,低端字数对应减少

2、当文本框内容超出时,会显示字数超出多少

 

效果图如下:

 

技术分享技术分享技术分享

 

实现代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#aa{
height: 150px;
width: 300px;
border: 1px solid grey;
}
#ff{
color: red;
}
</style>
</head>
<body>
<textarea id="aa" onkeyup="doinput(this)">

</textarea><br />
还可以输入<span id="dd" >140</span>个字
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span id="ff"></span>
</body>
</html>
<script language="javascript">
function doinput(txt)
{
var s = txt.value; //读取文本框内容
var n = s.length; //读取文本框内容的长度
var shengyu = 140-n; //140-去内容长度
if(shengyu>=0){
document.getElementById("dd").innerHTML = shengyu;
}
else{

document.getElementById("ff").innerHTML = "字数超出"+shengyu;
}
}
</script>

 

微博发布框---2017-04-14

原文:http://www.cnblogs.com/chenguanai/p/6707075.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!