Comment pouvez-vous déplacer le curseur sur la dernière position d'un textarea en Javascript?

J'ai un textarea et un bouton sur un formulaire. Le textarea peut déjà avoir un texte. Je voudrais déplacer le curseur à la dernière position dans la zone de texte lorsque le bouton est cliqué.

Est-ce possible?

InformationsquelleAutor | 2009-03-12

25

Par “la dernière position”, vous voulez dire la fin du texte?

Changeant le".valeur d'un champ de formulaire, déplace le curseur à la fin dans tous les navigateurs sauf IE. Avec IE, vous devez obtenir vos mains sales et délibérément manipuler la sélection, à l'aide de non-interfaces standards:
```
    if (browserIsIE) {
        var range= element.createTextRange();
        range.collapse(false);
        range.select();
    } else {
        element.focus();
        var v= element.value();
        element.value= '';
        element.value= v;
    }
```
Ou voulez-vous dire de mettre le curseur à l'endroit où il était auparavant, la dernière fois que le textarea a été porté?

Dans tous les navigateurs sauf IE, ce sera déjà arriver juste en appelant ‘élément.focus()’; le navigateur se souvient de la dernière curseur/la position de la sélection par entrée et il met l'accent sur.

Ce serait assez difficile à reproduire dans IE. Vous auriez à interroger tout le temps de vérifier où se trouve le curseur de sélection, a été, et n'oubliez pas cette position si elle était dans un élément d'entrée, de récupérer la position d'un élément donné lorsque le bouton a été pressé et le restaurer. Cela implique une certaine vraiment assez fastidieux de manipulation de document.sélection.createRange()’.

Je ne suis pas au courant de quoi que ce soit dans jQuery qui pourraient vous aider à faire cela, mais il pourrait y avoir un plugin, quelque part, peut-être?
- Je me sens sale pour avoir lu . . .
- Oh, c'est à dire la sélection de manipulation peut obtenir beaucoup plus de mal que ça! 🙂
- Pas sûr si cela est admissible... cette question est balisé jQuery. Mais, hey, cela devrait fonctionner 🙂
- Je peux mettre un ‘var element= $('#mytextarea'); " dans si je veux de l'aide 🙂
- En jQuery: var element = $("#ElementId"); element.focus(); var v = element.val(); element.val("); element.val(v);
- Fonctionne dans internet explorer 9 et internet explorer 10
InformationsquelleAutor bobince
34

xgMz réponse était le mieux pour moi. Vous n'avez pas besoin de s'inquiéter à propos du navigateur:
```
var html = $("#MyTextArea").val();
$("#MyTextArea").focus().val("").val(html);
```
Et voici une rapide extension jQuery que j'ai écrit pour ce faire, pour moi la prochaine fois:
```
; (function($) {
    $.fn.focusToEnd = function() {
        return this.each(function() {
            var v = $(this).val();
            $(this).focus().val("").val(v);
        });
    };
})(jQuery);
```
Utiliser comme ceci:
```
$("#MyTextArea").focusToEnd();
```
- vous pourriez jeter dans un c. trim() pour se débarrasser de toutes les retours à la ligne ..
- Nice! Merci!!!!
- J'ai dû appeler focus() par la suite, mais il fonctionne.
InformationsquelleAutor mkaj
6

Vous pouvez également le faire:
```
$(document).ready(function()
{
    var el = $("#myInput").get(0);

    var elemLen = el.value.length;

    el.selectionStart = elemLen;
    el.selectionEnd = elemLen;

    el.focus();
});
```
Ce code fonctionne pour les deux input et textarea. Testé avec les dernières versions des navigateurs Firefox 23, IE 11 et Chrome 28.

jsFiddle disponible ici: http://jsfiddle.net/cG9gN/1/

Source: https://stackoverflow.com/a/12654402/114029
- Celui-ci certainement œuvres.
InformationsquelleAutor Leniel Maccaferri
4

Vous pouvez utiliser cette https://github.com/DrPheltRight/jquery-caret
```
$('input').caretToEnd();
```
InformationsquelleAutor spilliton
3

C'est ce que j'utilise ces zones de texte à l'intérieur de mon onclick ou d'autres événements et semble bien fonctionner pour FireFox et IE 7 & 8. Il positionne le curseur à la fin du texte, au lieu de l'avant.
```
this.value = "some text I want to pre-populate";
this.blur();
this.focus();
```
- La seule solution qui en fait le travail pour moi (chrome v61).
InformationsquelleAutor Ken
2

Pour définir focus de la souris et déplacer le curseur à la fin de l'entrée. Son travail dans chaque navigateur, Sa logique est toute simple ici.
```
input.focus();
tmpStr = input.val();
input.val('');
input.val(tmpStr);
```
InformationsquelleAutor Selvamani

J'ai modifié @mkaj extension un peu à l'appui de la valeur par défaut

; (function($) {
    $.fn.focusToEnd = function(defaultValue) {
        return this.each(function() {
            var prevValue = $(this).val();
            if (typeof prevValue == undefined || prevValue == "") {
                prevValue = defaultValue;
            }
            $(this).focus().val("").val(prevValue);
        });
    };
})(jQuery);

//See it in action here
$(element).focusToEnd("Cursor will be at my tail...");

InformationsquelleAutor bn00d

Vous devez vous connecter pour publier un commentaire.