recherche

Maison >interface Web >js tutoriel >Exemple détaillé d'implémentation de jquery pour limiter le nombre de mots d'entrée dans la zone de texte

Exemple détaillé d'implémentation de jquery pour limiter le nombre de mots d'entrée dans la zone de texte

小云云
小云云original
2017-12-29 10:41:431142parcourir

Comment jquery limite-t-il le nombre de mots saisis dans une zone de texte ? Cet article présente principalement en détail la méthode d'utilisation de jquery pour limiter le nombre de mots saisis dans la zone de texte. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.

Les amis dans le besoin peuvent se référer aux exemples que j'ai écrits. Bien sûr, s'il y a des erreurs, j'espère que tout le monde pourra les signaler à temps afin que nous puissions apprendre et progresser ensemble. 


<!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>

Recommandations associées :

4750256ae76b6b9d804861d8f69e79d3 de HTML Comment utiliser

Exemple détaillé de la façon d'ajouter des numéros de ligne à la zone de texte Textarea en JavaScript

La solution parfaite au texte d'invite de la zone de saisie Textarea en HTML indiquant que le contenu par défaut doit être ajouté

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Un exemple pour expliquer l'effet de défilement intermittent du texte ligne par ligne vers le haut implémenté par jQueryArticle suivant：Un exemple pour expliquer l'effet de défilement intermittent du texte ligne par ligne vers le haut implémenté par jQuery

Articles Liés

Voir plus