Heim  >  Artikel  >  Web-Frontend  >  Detailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich

Detailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich

小云云
小云云Original
2017-12-29 10:41:431127Durchsuche

Wie begrenzt JQuery die Anzahl der in einen Textbereich eingegebenen Wörter? In diesem Artikel wird hauptsächlich die Methode zur Begrenzung der Anzahl der in den Textbereich eingegebenen Wörter vorgestellt. Interessierte Freunde können darauf verweisen.

Freunde in Not können sich auf die Beispiele beziehen, die ich geschrieben habe. Natürlich hoffe ich, dass jeder rechtzeitig darauf hinweisen kann, damit wir daraus lernen und gemeinsam Fortschritte machen können.


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

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

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

Verwandte Empfehlungen:

HTML's 4750256ae76b6b9d804861d8f69e79d3 Verwendung von

Detailliertes Beispiel für das Hinzufügen von Zeilennummern zum Textfeld „Textarea“ in JavaScript

Die perfekte Lösung für den Eingabeaufforderungstext des Textfelds „Textarea“ in HTML, dass der Standardinhalt hinzugefügt werden muss

Das obige ist der detaillierte Inhalt vonDetailliertes Beispiel einer JQuery-Implementierung zur Begrenzung der Anzahl der Eingabewörter im Textbereich. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn