style attribute javascript html caret

javascript - attribute - title html



Obtener la posiciĆ³n de intercalaciĆ³n en la entrada de HTML? (4)

-> selectionStart

<!doctype html> <html> <head> <meta charset = "utf-8"> <script type = "text/javascript"> window.addEventListener ("load", function () { var input = document.getElementsByTagName ("input"); input[0].addEventListener ("keydown", function () { alert ("Caret position: " + this.selectionStart); // You can also set the caret: this.selectionStart = 2; }); }); </script> <title>Test</title> </head> <body> <input type = "text"> </body> </html>

¿Cómo obtengo el índice del texto de intercalación en una entrada?


A continuación, obtendrá el inicio y el final de la selección como índices de caracteres. Funciona para entradas de texto y áreas de texto, y es un poco complicado debido al extraño manejo de saltos de línea de IE.

function getInputSelection(el) { var start = 0, end = 0, normalizedValue, range, textInputRange, len, endRange; if (typeof el.selectionStart == "number" && typeof el.selectionEnd == "number") { start = el.selectionStart; end = el.selectionEnd; } else { range = document.selection.createRange(); if (range && range.parentElement() == el) { len = el.value.length; normalizedValue = el.value.replace(//r/n/g, "/n"); // Create a working TextRange that lives only in the input textInputRange = el.createTextRange(); textInputRange.moveToBookmark(range.getBookmark()); // Check if the start and end of the selection are at the very end // of the input, since moveStart/moveEnd doesn''t return what we want // in those cases endRange = el.createTextRange(); endRange.collapse(false); if (textInputRange.compareEndPoints("StartToEnd", endRange) > -1) { start = end = len; } else { start = -textInputRange.moveStart("character", -len); start += normalizedValue.slice(0, start).split("/n").length - 1; if (textInputRange.compareEndPoints("EndToEnd", endRange) > -1) { end = len; } else { end = -textInputRange.moveEnd("character", -len); end += normalizedValue.slice(0, end).split("/n").length - 1; } } } } return { start: start, end: end }; } var textBox = document.getElementById("textBoxId"); textBox.focus(); alert( getInputSelection(textBox).start );


Ahora hay un buen plugin jQuery para esto: plugin Caret

Luego puede llamar a $("#myTextBox").caret();


Habíamos usado algo así para una antigua aplicación de JavaScript, pero no la he probado en un par de años:

function getCaretPos(input) { // Internet Explorer Caret Position (TextArea) if (document.selection && document.selection.createRange) { var range = document.selection.createRange(); var bookmark = range.getBookmark(); var caret_pos = bookmark.charCodeAt(2) - 2; } else { // Firefox Caret Position (TextArea) if (input.setSelectionRange) var caret_pos = input.selectionStart; } return caret_pos; }