jquery實現(xiàn)限制textarea輸入字數(shù)的方法

更新時間：2017年09月06日 09:23:05 作者：一笑風(fēng)云

這篇文章主要為大家詳細介紹了jquery實現(xiàn)限制textarea輸入字數(shù)的方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下

jquery怎么實現(xiàn)限制textarea輸入的字數(shù)呢？有需要的朋友可以參考一下我寫的例子，當然如果有誤，也希望大家能及時指出來，大家共同學(xué)習(xí)進步。

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>textarea 限制字數(shù)</title>
 <style>
  .container{
   position: relative;
   width: 730px;
  }
  .container span{
   position: absolute;
   bottom: 20px;
   right: 30px;
  }
 </style>
</head>
<body>
 <div class="container">
  <textarea name="content" id="content" cols="100" rows="10"></textarea>
  <span>0/10</span>
 </div>
 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
 <script>
  $(function(){
    /**
    * textarea 限制輸入字數(shù)
    * @param string str 類名或ID
    * @param number num 限制輸入的字數(shù)
    */
   function limitImport(str,num){
    $(document).on('input propertychange',str,function(){
     var self = $(this);
     var content = self.val();
     if (content.length > num){
      self.val(content.substring(0,num));
     } 
     self.siblings('span').text(self.val().length+'/'+num);
    });
   }

   //用法示例
   limitImport('#content',10);

  })
 </script>
</body>
</html>

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jQuery實現(xiàn)的自定義滾動條實例詳解
這篇文章主要介紹了jQuery實現(xiàn)的自定義滾動條,結(jié)合完整實例詳細分析了jQuery自定義滾動條的實現(xiàn)步驟與相關(guān)操作技巧,并給出了jquery.jscroll.js插件的完整代碼,需要的朋友可以參考下
2016-09-09
JQuery異步提交表單與文件上傳功能示例
這篇文章主要介紹了JQuery異步提交表單與文件上傳功能,結(jié)合實例形式分析了jQuery表單提交及文件傳輸操作的相關(guān)實現(xiàn)技巧,需要的朋友可以參考下
2017-01-01
Jquery瀑布流插件使用介紹
瀑布流布局在目前貌似很火爆，具體的分析、原理、用到的知識等等可以看看以下幾位牛人寫的東西
2012-10-10
jquery tab插件制作實現(xiàn)代碼
jquery插件豐富，很多都是很好用的，最近學(xué)習(xí)了一下如何制作jquery插件，發(fā)現(xiàn)jquery插件制作其實很簡單，這里介紹一下。
2010-06-06
jQuery自定義圖片上傳插件實例代碼
這篇文章給大家介紹了jquery自定義圖片上傳插件的實例代碼，非常不錯，具有參考借鑒價值，需要的朋友一起看看吧
2017-04-04
jQuery中clone()函數(shù)實現(xiàn)表單中增加和減少輸入項
這篇文章給大家介紹了jQuery中clone()函數(shù)實現(xiàn)表單中增加和減少輸入項的實例代碼，非常不錯，具有參考借鑒價值，需要的朋友參考下吧
2017-05-05
jQuery制作網(wǎng)頁版選項卡
這篇文章主要為大家詳細介紹了jQuery制作網(wǎng)頁版選項卡的相關(guān)方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-07-07
jquerydom對象的事件隱藏顯示和對象數(shù)組示例
本文為大家介紹下jquery的dom對象的事件隱藏顯示和對象數(shù)組，感興趣的朋友可以參下
2013-12-12
jQuery flip插件實現(xiàn)的翻牌效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery flip插件實現(xiàn)的翻牌效果,可實現(xiàn)類似卡羅牌翻頁的視覺效果,涉及jquery.flip.min.js插件的使用,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2016-09-09
jquery easyui combobox模糊過濾(示例代碼)
這篇文章主要介紹了jquery easyui combobox模糊過濾(示例代碼)。需要的朋友可以過來參考下，希望對大家有所幫助
2013-11-11