jQuery: obtient les valeurs du champ de texte lors de la saisie

Question

Je souhaite obtenir la valeur du champ de texte lors de la saisie.

<input type="text" name="noofppl"> 

Je veux obtenir sa valeur lors de la frappe, si quelqu'un tape moins de 20 je donne une alerte que le nombre minimum autorisé est 20.

S'il vous plaît me aider.

Voici ce que j'ai essayé:

$("#people").focusout(function() { 
    if($(this).val()<20){ 
    alert("Minimum number of people should be 20"); 
    } 
}); 

Answer 1

Utilisez la fonction jQuery keyup. Obtenez la valeur chaque fois valitate. Afficher le message à chaque fois à chaque fois que vous appuyez sur le bouton Vous devez utiliser le raccourci clavier.

Answer 2

Ici, vous allez avec une méthode solution

$('input[name="noofppl"]').keyup(function(){ 
 
    console.log($(this).val()); 
 
}); 
 
    
 
$('input[name="noofppl"]').focusout(function(){ 
 
    if($(this).val().length < 20){ 
 
    alert("Minimum character is 20!!!"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="noofppl">

Je l'ai utilisé jQuerykeyup & focusout.

keyup pour obtenir la valeur continue tout en tapant.

focousout est de vérifier le nombre de caractères.

Document de référence:https://api.jquery.com/keyup/

Espérons que cela vous aidera.

Answer 3

Est-ce que vous cherchez quelque chose comme ça? Ajoutez une étiquette derrière votre entrée pour montrer le texte et donnez à votre champ de saisie un identifiant 'noofppl'. J'ai fait ce code il y a un moment pour limiter ma zone de texte.

var textarea = document.getElementById('noofppl'); 

textarea.on("keypress", function() { 
       var char_label = document.getElementById('charcount_text'); 

       var count = textarea.value.length; 
       var max = 20; 

       var remaining = max - count; 
       if (remaining <= 0) { 
       char_label.innerHTML = '20 character limit reached.'; 
       } else { 
       char_label.innerHTML = remaining +"/20 left"; 
       } 
      }); 

Answer 4

$('#myInput').on('keyup', function() { 
 
    console.log($('#myInput')[0].value.length); 
 
});

<input id="myInput" type="text" name="noofppl">

Answer 5

s'il vous plaît vérifier:

<input type="text" name="noofppl"> 
$('input').keyup(function(){var yourvalue = $(this).val(); }) 

Cela devrait fonctionner pour vous

Answer 6

Voir l'exemple ci-dessous:

$("#txt").keyup(function(event) { 
 
    text = $(this).val(); 
 
    $("div").text(text); 
 
}); 
 
$('#txt').focusout(function(){ 
 
    if($(this).val().length < 20){ 
 
    \t alert(" Minimum 20 Words required...!! "); 
 
\t } 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" name="noofppl" id="txt"> 
 
<div> 
 

 
</div>

Answer 7

j'utiliser écouteur d'événement input ou quelque chose de similaire, voici par exemple rapide comment vous pouvez y arriver: jsbin

const $input = $('#input'); 
let t; 
$input.on('input', (el) => { 
    clearTimeout(t); 
    t = setTimeout(() => { 
    if ($input.val().length < 20) { 
     alert('shorter than 20 characters');  
    } else { 
     alert('longer or equal than 20 characters'); 
    } 
    }, 400); 
}) 

Plus: MDN input reference