Pour les développeurs Web, jQuery est une bibliothèque très utile qui peut rendre le code JavaScript plus concis et plus facile à lire. Dans jQuery, il existe de nombreuses méthodes qui aident les développeurs à obtenir et manipuler facilement des éléments HTML.
Cet article se concentrera sur la façon dont jQuery obtient la zone de texte (Textarea).
Tout d'abord, si vous n'êtes pas familier avec les champs de texte, vous pouvez y jeter un bref coup d'œil. Un champ de texte est un contrôle de formulaire en HTML qui permet aux utilisateurs de saisir plusieurs lignes de texte. Les champs de texte sont généralement utilisés dans des scénarios tels que les commentaires des utilisateurs et la saisie de messages.
Dans jQuery, obtenir la valeur d'un champ de texte est très simple. Supposons que nous ayons un élément de champ de texte :
<textarea id="myTextArea"></textarea>
Pour obtenir la valeur de ce champ de texte, vous pouvez utiliser la méthode .val(). Par exemple, le code suivant obtiendra la valeur du champ de texte et l'imprimera sur la console :
var textAreaValue = $('#myTextArea').val();
console.log(textAreaValue);Lorsque l'utilisateur entre une valeur dans le champ de texte et clique sur le bouton Soumettre, vous devrez peut-être utiliser jQuery pour obtenir la valeur. et envoyez-le au serveur. Voici l'exemple de code :
$('#submitButton').on('click', function() {
var textAreaValue = $('#myTextArea').val();
$.ajax({
url: 'submit.php',
method: 'post',
data: {textAreaValue: textAreaValue},
success: function(response) {
console.log(response);
},
error: function() {
console.log('There was an error submitting the form.');
}
});
});Le code ci-dessus enverra une requête AJAX POST à submit.php lorsque vous cliquerez sur le bouton de soumission, où les données de la requête incluent la valeur du champ de texte. En cas de succès, la réponse sera imprimée sur la console.
De plus, si vous devez modifier la valeur du champ de texte de manière dynamique, vous pouvez utiliser le code suivant :
$('#myTextArea').val('New Value');Le code ci-dessus remplacera la valeur d'origine dans le champ de texte par le nouveau texte.
Si vous devez ajouter du texte par défaut à la zone de texte, vous pouvez le faire en ajoutant l'attribut placeholder à la balise