Afficher la ligne actuelle et le numéro de colonne pour une zone de texte

Question

Je crée une interface d'édition de fichier dans mon application web, j'ai une zone de texte avec le contenu du fichier. Lorsque la zone de texte est mise au point, je veux afficher la position du curseur, c'est-à-dire le numéro de ligne et la colonne: ceci est utile car les messages d'erreur donnent généralement un numéro de ligne, par exemple.

La question est: comment puis-je déterminer la position du curseur dans la zone de texte? J'utilise une bibliothèque prototype. Peut-être existe-t-il déjà une solution?

Je ne suis pas vraiment intéressé par les barres d'outils de fantaisie pour le textarea, qui sont offerts par ces widgets avancés.

Answer 1

Vous pouvez consulter ces 2 liens:

http://www.dedestruct.com/2008/03/22/howto-cross-browser-cursor-position-in-textareas/^{[La source orginal n'existe pas de plus, les points de liaison modifiés à la dernière version du Web Archive]}

https://developer.mozilla.org/En/DOM:Selection

..une fois que vous avez une sélection (index du curseur dans le texte), vous pouvez diviser votre texte par des retours à la ligne, obtenant ainsi le numéro de ligne. vous pouvez obtenir la colonne par index détermination du début d'une ligne

Answer 2

Quand je veux la ligne actuelle nombre de textarea et de la colonne actuelle de textarea, je résolu comme ceci:

<textarea onkeyup="getLineNumberAndColumnIndex(this);" onmouseup="this.onkeyup();" > 
</textarea> 

function getLineNumberAndColumnIndex(textarea){ 
    var textLines = textarea.value.substr(0, textarea.selectionStart).split("\n"); 
    var currentLineNumber = textLines.length; 
    var currentColumnIndex = textLines[textLines.length-1].length; 
    console.log("Current Line Number "+ currentLineNumber+" Current Column Index "+currentColumnIndex); 
    }