2017-10-01 6 views
0

J'ai 3 textareas, je veux compter uniquement la valeur de chaque textarea et l'afficher en arrièrecompte unique valeur de plusieurs textarea

$(".textarea").keyup(function(){ 
 
    $(".display").text($(this).val().length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div>

Je veux seulement le length du textarea particulier qui est tapé dans.

Répondre

4

Utilisez la méthode next pour obtenir la prochaine div.display immédiate. Cette méthode permet de rechercher par le frère immédiatement après dans les DOM

$(".textarea").keyup(function() { 
 
    $(this).next(".display").text($(this).val().length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div>

2

$(".textarea").keyup(function() { 
 
    $(this).parent().find(".display").text($(this).val().length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div> 
 
    <textarea class="textarea"></textarea> 
 
    <div class="display"></div> 
 
</div> 
 

 
<div> 
 
    <textarea class="textarea"></textarea> 
 
    <div class="display"></div> 
 
</div> 
 

 
<div> 
 
    <textarea class="textarea"></textarea> 
 
    <div class="display"></div> 
 
</div>

1

$(".textarea").keyup(function(){ 
 
    $(this).next(".display").text($(this).val().length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div> 
 

 
<textarea class="textarea"></textarea> 
 
<div class="display"></div>