HTMLTextAreaElement : méthode setSelectionRange()
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
La méthode setSelectionRange() de l'interface HTMLTextAreaElement définit les positions de début et de fin de la sélection de texte courante, et éventuellement la direction, dans un élément HTML <textarea>. Cela met à jour immédiatement l'état de la sélection, bien que la surbrillance visuelle n'apparaisse que lorsque l'élément est sélectionné. La direction indique dans quel sens la sélection doit être considérée comme ayant eu lieu ; par exemple, que la sélection a été définie par l'utilisateur·ice en cliquant et en faisant glisser de la fin du texte sélectionné vers le début. De plus, les évènements select et selectionchange sont déclenchés.
Cette méthode met à jour immédiatement les propriétés HTMLTextAreaElement.selectionStart, HTMLTextAreaElement.selectionEnd et HTMLTextAreaElement.selectionDirection, quel que soit l'état de sélection. La surbrillance visuelle de la sélection nécessite que l'élément soit sélectionné.
Note :
Bien que setSelectionRange() mette à jour immédiatement les propriétés de sélection, la surbrillance visuelle de la sélection n'apparaît que lorsque le <textarea> est sélectionné. Sélectionner l'élément déclenchera également un évènement selectionchange.
Pour sélectionner tout le texte d'un élément <textarea>, utilisez la méthode HTMLTextAreaElement.select().
Syntaxe
setSelectionRange(selectionStart, selectionEnd)
setSelectionRange(selectionStart, selectionEnd, selectionDirection)
Paramètres
selectionStart-
L'indice du premier caractère sélectionné. Un indice supérieur à la longueur de la valeur de l'élément est considéré comme pointant à la fin de la valeur. Voir la propriété
selectionStartpour plus d'informations. selectionEnd-
L'indice du caractère après le dernier caractère sélectionné. Un indice supérieur à la longueur de la valeur de l'élément est considéré comme pointant à la fin de la valeur. Si
selectionEndest inférieur àselectionStart, alors les deux sont considérés comme ayant la valeur deselectionEnd. Voir la propriétéselectionEndpour plus d'informations. selectionDirectionFacultatif-
Le mot-clé
"forward","backward"ou la valeur par défaut"none"— indiquant la direction dans laquelle la sélection est considérée comme ayant été effectuée. Voir la propriétéselectionDirectionpour plus d'informations.
Valeur retournée
Aucune (undefined).
Exemples
const textarea = document.getElementById("text-box");
const chars = textarea.textLength;
// si la valeur contient plus de 10 caractères
if (chars > 10) {
// L'élément doit être sélectionné pour pouvoir sélectionner une plage de
// texte à l'intérieur
textarea.focus();
// sélectionner le texte entre le cinquième caractère depuis le début et
// le cinquième caractère depuis la fin
textarea.setSelectionRange(5, chars - 5);
} else {
// sinon sélectionner tout le texte
textarea.select();
}
Spécifications
| Specification |
|---|
| HTML # dom-textarea/input-setselectionrange-dev |
Compatibilité des navigateurs
Voir aussi
- L'élément HTML
<textarea> - L'interface
HTMLTextAreaElement - La méthode
HTMLTextAreaElement.select() - La propriété
HTMLTextAreaElement.textLength - L'API
Selection - Le pseudo-élément
::selection