Déplacer le curseur avec le Javascript?

Je suis à la recherche pour déplacer le curseur exactement quatre places à l'avance de sa position actuelle, de sorte que je peux insérer un onglet correctement. J'ai déjà le code HTML d'insertion dans le signe du poste de travail, mais quand j'ai insérer le code HTML, le curseur est à gauche derrière. J'ai passé l'heure en regardant les différentes façons de le faire et j'ai essayé beaucoup d'eux, mais je peux pas faire de à travailler pour moi. Voici la plus récente de la méthode que j'ai essayé:

function moveCaret(input, distance) {
    if(input.setSelectionRange) {
        input.focus();
        input.setSelectionRange(distance, distance);
    } else if(input.createTextRange) {
        var range = input.createTextRange();
        range.collapse(true);
        range.moveEnd(distance);
        range.moveStart(distance);
        range.select();
    }
}

Il ne fait absolument rien-ne pas déplacer le curseur, de jeter des erreurs ou quoi que ce soit. Cela me laisse perplexe. Et oui, je sais que la méthode ci-dessus défini (est censé) réglez le curseur à une certaine position depuis le début de ce nœud (qui est, input), mais même cela ne fonctionne pas. Donc, exactement ce que je fais mal, et comment puis-je faire?

Edit: Basé sur les liens que l'o.v. à condition, j'ai réussi à bricoler quelque chose ensemble, c'est enfin faire quelque chose: lancer une erreur. Yay!!! Voici le nouveau code:

this.moveCaret = function(distance) {
    if(that.win.getSelection) {
        var range = that.win.getSelection().getRangeAt(0);
        range.setStart(range.startOffset + distance);
    } else if (that.win.document.selection) {
        var range = that.win.document.selection.createRange();
        range.setStart(range.startOffset + distance);
    }
}

Maintenant, cela donne l'erreur Uncaught Error: NOT_FOUND_ERR: DOM Exception 8. Des idées pourquoi?

Avez-vous essayez de définir le element.selectionStart et element.selectionEnd? Il devrait fonctionner de la croix-navigateur pour l'entrée et la textareas aussi loin que je me souvienne.
J'évitais parce que je crois qu'elle ne fonctionne pas dans les versions antérieures de IE8. Je vais prendre un coup d'oeil à elle de toute façon, si.
La seule version de IE je l'ai tester avec IE9, bonne chance. 🙂
Oui, il semble selectionStart ne fonctionne pas dans les versions antérieures d'IE, mais merci en tout cas. =)
Double Possible: stackoverflow.com/questions/1181700/... Ceci et ceci réponse semblent avoir reçu beaucoup de reconnaissance.

OriginalL'auteur Elliot Bonneville | 2012-05-28

  1. 20

    L'extrait de code que vous avez est des entrées de texte et textareas, pas contenteditable éléments.

    À condition que tous vos contenus en un seul nœud de texte et la sélection est entièrement contenue dans elle-même, la volonté de travailler dans tous les principaux navigateurs, y compris IE 6.

    Démo: http://jsfiddle.net/9sdrZ/

    Code:

    function moveCaret(win, charCount) {
    var sel, range;
    if (win.getSelection) {
        //IE9+ and other browsers
        sel = win.getSelection();
        if (sel.rangeCount > 0) {
            var textNode = sel.focusNode;
            var newOffset = sel.focusOffset + charCount;
            sel.collapse(textNode, Math.min(textNode.length, newOffset));
        }
    } else if ( (sel = win.document.selection) ) {
        //IE <= 8
        if (sel.type != "Control") {
            range = sel.createRange();
            range.move("character", charCount);
            range.select();
        }
    }
}
    +1 parce que c'est vraiment utile extrait de code. Juste une question: pourquoi voulez vous accéder au global par la victoire de l'argument?
    Toutefois, si vous avez besoin de se déplacer à la précédente nœud de texte, cela échoue car sel.focusNode == 0
    Ce genre d'explication, voulez-vous? La Gamme et les méthodes de Sélection sont standard et bien documenté. Le code est court et simple. Aussi, si vous souhaitez annoter avec des commentaires, il est possible pour vous de le faire. Les seuls commentaires que je me sens peut-être utile serait d'étiquettes pour les deux principales branches de code (IE 9+ et les autres navigateurs, IE 6 - 8).
    Donner de pré-faites la solution ne contribue guère à combler les lacunes en matière de connaissances. Il aurait été agréable pour vous faire remarquer ce qui s'est passé dans la interlocuteur du code, je suis sûr que c'est des Piles de l'étiquette.
    Je suis coupable de cela à des centaines de réponses. Je ne pense pas que c'est universel pratique pour ajouter un commentaire à tous les code; je ne suis pas sûr de savoir si je pense qu'il devrait être. Ne plus se tenir par la main d'encourager ou de décourager les gens de la recherche sur le navigateur Api j'ai utilisé ici? Je ne sais pas. De toute façon, j'ai ajouté un peu de détails dans cette réponse.

    OriginalL'auteur Tim Down