首頁 > web前端 > js教程 > jquery實作textarea輸入框限製字數的方法

jquery實作textarea輸入框限製字數的方法

PHPz
發布: 2018-09-29 16:49:39
轉載
926 人瀏覽過

這篇文章主要介紹了jquery實現textarea輸入框限製字數的方法,透過keyup事件實時讀取textarea輸入框的字數來實現這一功能,非常具有實用價值,需要的朋友可以參考下

本文實例講述了jquery實作textarea輸入框限製字數的方法。分享給大家供大家參考。具體分析如下:

網路上有使用屬性 disabled 來實現,這個不好,想修改都沒有修改。當然,這也不是很完美。

<html>
<head>
<title> jquery完美实现textarea输入框限制字数</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<script type="text/javascript" src="jquery-1.8.2.min.js"></script>
<script type="text/javascript">
 $(function(){
  $("#weibo").keyup(function(){
   var len = $(this).val().length;
   if(len > 139){
    $(this).val($(this).val().substring(0,140));
   }
   var num = 140 - len;
   $("#word").text(num);
  });
 });
</script>
<style type="text/css">
h6{color:blue;}
textarea{resize:none;}
#word{color:red;}
</style>
</head>
<body>
<h6>说点什么吧,你可以输入<span>140</span>个字,现在剩余<span id="word">140</span>个</h6>
<textarea name="con" id="weibo" cols="45" rows="6"></textarea>
</body>
</html>
登入後複製

希望本文所述對大家的jQuery程式設計有所幫助,更多相關教學請造訪jQuery影片教學

來源:jb51.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板