Maison > interface Web > js tutoriel > Comment puis-je définir la position du curseur dans une zone de texte à l'aide de jQuery ?

Comment puis-je définir la position du curseur dans une zone de texte à l'aide de jQuery ?

Patricia Arquette
Libérer: 2024-12-08 15:28:11
original
977 Les gens l'ont consulté

How Can I Set the Cursor Position in a Text Area Using jQuery?

Définition de la position du curseur dans une zone de texte avec jQuery

Problème :

Comment pouvez-vous définir la position du curseur dans une zone de texte utilisant jQuery ? Vous disposez d'une zone de texte avec du contenu existant et vous souhaitez positionner automatiquement le curseur à un décalage spécifique lorsque le champ reçoit le focus.

Solution :

Pour jQuery, l'extrait de code suivant peut être utilisé pour obtenir cette fonctionnalité :

$.fn.selectRange = function(start, end) {
    if(end === undefined) {
        end = start;
    }
    return this.each(function() {
        if('selectionStart' in this) {
            this.selectionStart = start;
            this.selectionEnd = end;
        } else if(this.setSelectionRange) {
            this.setSelectionRange(start, end);
        } else if(this.createTextRange) {
            var range = this.createTextRange();
            range.collapse(true);
            range.moveEnd('character', end);
            range.moveStart('character', start);
            range.select();
        }
    });
};
Copier après la connexion

Avec cette fonction, vous pouvez utiliser ce qui suit syntaxe :

$('#elem').selectRange(3,5); // select a range of text
$('#elem').selectRange(3); // set cursor position
Copier après la connexion

Cela vous permet de définir la position du curseur dans la zone de texte, que vous souhaitiez sélectionner une plage de texte ou simplement positionner le curseur à un décalage spécifique.

Ressources supplémentaires :

  • [JsFiddle Démo](https://jsfiddle.net/ywkf09w4/)
  • [Démo JsBin](https://jsbin.com/xewotib/edit?html,console,output)

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!

source:php.cn
Déclaration de ce site Web
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
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal