jquery實現(xiàn)textarea輸入字符控制(仿微博輸入控制字符)
更新時間：2013年04月26日 15:32:13 作者：
首先獲取輸入框的值然后獲取輸入框的值;如果字數(shù)大于500、發(fā)布按鈕禁用否從發(fā)布按鈕啟用，感興趣的朋友可以詳細了解下哈
效果圖如下：
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){ //如果字數(shù)大于500
$(".public").addClass("public01").attr("disabled","true") //發(fā)布按鈕禁用
}
else{
$(".public").removeClass("public01").removeAttr("disabled") //發(fā)布按鈕啟用
}
});
字數(shù)的樣式：
#numtj em {
font-weight: 700;
font-size: 22px;
font-style: italic;
font-family: Constantia, Georgia;
color:#C00;
}
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){ //如果字數(shù)大于500
$(".public").addClass("public01").attr("disabled","true") //發(fā)布按鈕禁用
}
else{
$(".public").removeClass("public01").removeAttr("disabled") //發(fā)布按鈕啟用
}
});
字數(shù)的樣式：
復制代碼 代碼如下:
#numtj em {
font-weight: 700;
font-size: 22px;
font-style: italic;
font-family: Constantia, Georgia;
color:#C00;
}
相關文章
獲取iframe的document對象進行dom的操作，實現(xiàn)方法很多，下面是jquery的實現(xiàn)過程，喜歡玩iframe的朋友可以參考下2014-10-10
jQuery的animate函數(shù)實現(xiàn)圖文切換動畫效果
animate()在jquery中作為一個方法,可用于創(chuàng)建動畫效果，jquery中的animate()方法讓那個頁面增加了很好的視覺效果2015-05-05
這篇文章主要為大家詳細介紹了jQuery布局組件EasyUI Layout的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-02-02
jQuery Ajax 加載數(shù)據(jù)時異步顯示加載動畫
這篇文章主要介紹了jQuery Ajax 加載數(shù)據(jù)時異步顯示加載動畫的相關資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下2016-08-08
jQuery的時間datetime控件在AngularJs中的使用實例(分享)
下面小編就為大家?guī)硪黄猨Query的時間datetime控件在AngularJs中的使用實例(分享)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-08-08
jQuery提供css()的方法來實現(xiàn)嵌入式改變元素樣式，css()方法在使用上具有多樣性。2010-02-02
這篇文章主要介紹了jquery中EasyUI使用技巧小結,都是些個人經(jīng)驗，分享給大家，需要的朋友可以參考下2015-02-02
這篇文章主要介紹了jquery顯示隱藏input對象,需要的朋友可以參考下2014-07-07
詳解Jquery 遍歷數(shù)組之$().each方法與$.each()方法介紹
這篇文章主要介紹了詳解Jquery 遍歷數(shù)組之$().each方法與$.each()方法介紹 ,具有一定的參考價值，有興趣的可以了解一下。2017-01-01
Jquery實現(xiàn)列表(隔行換色,全選,鼠標滑過當前行)效果實例
Jquery實現(xiàn)列表(隔行換色,全選,鼠標滑過當前行)效果實例，需要的朋友可以參考一下2013-06-06