jquery实现textarea输入字符控制(仿微博输入控制字符)

效果图如下:

JQUERY 代码:


代码如下:

var text=$(".release textarea").val();//获取输入框的值
var counter=text.length; //获取输入框的值
$("#numtj em").text(500-counter);
$(document).keyup(function() {
var text=$(".release textarea").val();
var counter=text.length;
$("#numtj em").text(500-counter);
if(counter>500){ //如果字数大于500
$(".public").addClass("public01").attr("disabled","true") //发布按钮禁用
}
else{
$(".public").removeClass("public01").removeAttr("disabled") //发布按钮启用
}
});

字数的样式:


代码如下:

#numtj em {
font-weight: 700;
font-size: 22px;
font-style: italic;
font-family: Constantia, Georgia;
color:#C00;
}

(0)

相关推荐

  • js完美实现@提到好友特效(兼容各大浏览器)

    要求 1.输入@时,弹出匹配的好友菜单 2.光标进入包含有"@好友"的标签时,弹出菜单 3.按backspace删除时,如果光标前面是包含有"@好友"的标签,弹出菜单 4.兼容ie,firefox. 具体做法 针对要求一,很自然的会想到对输入框绑定事件.这里要绑定mousedown,而不是mouseup.因为如果是mouseup的话,用event.preventDefault()是无法阻止键盘输入@的.另外,这里在事件回调中用return false也是起不了作用的

  • 仿微博字符限制效果实现代码

    这是初始状态 输入文字变成这样,这里会区分圆角半角,2个半角的文字算一个. 这个是超出的样子 如果超出了点击提交,会有红色闪动提示 好了,效果就是这样子,都是js的..用的话,记得加个jq文件过来.. 这里是超出只有提示,还可以超出以后截掉多余的..不过公司项目不用,说是体验不好~~~ 复制代码 代码如下: var oH2 = $("#spetit_word");//提示文字 var oTextarea = $("#p_qa_content");//输入框 var

  • js仿百度贴吧验证码特效实例代码

    今天看到有百度验证码挺有意思的,就把它仿下来了. 利用JS实现当选择满4个后自动对比,本文中采用静态对比的方法看你是否全部选择对.然后提示[答案正确!]或[答案错误!], 以后有空再去做成程序,先分享给大家! 效果图如下: 源代码如下: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tran

  • 仿新浪微博登陆邮箱提示效果的js代码

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8

  • JS实现模仿微博发布效果实例代码

    效果: 思路: 利用多功能浮动运动框架实现微博效果,首先,将textarea中的属性添加到新创建的li里面然后,再将li添加到ul里面,再利用浮动运动框架将数据动态的显示出来. 代码: 复制代码 代码如下: <head runat="server">    <title></title>    <style type="text/css">        *        {            margin: 0;

  • Jquery与JS两种方法仿twitter/新浪微博 高度自适应无缝滚动实现代码

    首先是Jquery 无标题文档 $(function(){ var scrtime; $("#con").hover(function(){ clearInterval(scrtime); },function(){ scrtime = setInterval(function(){ var $ul = $("#con ul"); var liHeight = $ul.find("li:last").height(); $ul.animate({

  • 通过Jscript中@cc_on 语句识别IE浏览器及版本的代码

    激活条件编译支持. @cc_on 备注 @cc_on 语句激活脚本引擎中的条件编译. 强烈推荐在注释中使用 @cc_on 语句,以使不支持条件编译的浏览器将您的脚本视为有效语法而接受它: /*@cc_on*/ // The remainder of the script.或者,在注释外的一个 @if 或 @set 语句也将激活条件编译. 要求 版本 3 请参见 参考 @if...@elif...@else...@end 语句 @set 语句 复制代码 代码如下: /*@cc_on @if (@_

  • 简单易用的基于jQuery版仿新浪微博向下滚动效果(附DEMO)

    简单易用的jQuery 写的仿新浪微博 向下滚动效果 $(function(){ var scrtime; $("#con").hover(function(){ clearInterval(scrtime); },function(){ scrtime = setInterval(function(){ var $ul = $("#con ul"); var liHeight = $ul.find("li:last").height(); $u

  • Jquery实现仿腾讯微博发表广播

    前言: 由于这几天在学习Jquery的一些知识,比以前的感觉就是Jquery太强大了,很多很简单的功能以前在JavaScript要写几十行的代码而在Jquery中只用几行代码就搞定了,所以我决定好好学习学习Jquery,支持我吧,呵呵,这几天的学习Jquey使我感觉到其实Jquery的使用并不是很难,就我感觉Jquery只要把选择器学的差不多,其他的基本都可以迎刃而解,多了解一些方法,事件等等.所以我在这里实现了一个Jquery实现仿腾讯微薄的广播发表. 1. 首先新建HTML页面和介绍我要实现

  • JS 仿腾讯发表微博的效果代码

    最近2天研究了下 腾讯发表微博的效果 特此来分享下,效果如下: 在此分享前 来谈谈本人编写代码的习惯,很多人会问我既然用的是jquery框架 为什么写的组件不用Jquery那种形式?我当时回答的是:每个人编写代码有每个人的习惯.但是我更想表达的是:这种编码个人觉得 有一个很大的优点,我不是非常依赖于Jquery框架,因为不同的公司有不同的框架 比如在淘宝用的kissy框架 在支付宝用的是支付宝框架 在百度用的是百度框架 在腾讯有腾讯的前端js框架 假如我的编写代码太依赖于jquery 那假如其他

  • python通过正则查找微博@(at)用户的方法

    本文实例讲述了python通过正则查找微博@(at)用户的方法.分享给大家供大家参考.具体如下: 这段代码用到了python正则的findall方法,查找所有被@的用户,使用数组形式返回用户昵称 import re users = re.findall(r'@([\u4e00-\u9fa5\w\-]+)','nihao @dfugo @jb51 haha') print(users) 返回结果如下: ['dfugo', 'jb51'] 希望本文所述对大家的Python程序设计有所帮助.

随机推荐