Wie kann ich die Cursorposition in einem Texteingabefeld ermitteln?

Bestimmen der Cursorposition innerhalb eines Texteingabefelds

Das Ermitteln der Cursorposition innerhalb eines Texteingabefelds kann die Benutzererfahrung verbessern und bestimmte Aufgaben vereinfachen Funktionalitäten. So können Sie dies erreichen:

jQuery-Lösung

Für einen unkomplizierten Ansatz können Sie die Eigenschaft „selectionStart“ des Eingabefeldelements verwenden. Diese Eigenschaft gibt den Zeichenindex der aktuellen Position des Caretzeichens innerhalb des Felds zurück.

$("#myinput").on("input", function() {
  let caretPosition = $(this).prop("selectionStart");
});

Benutzerdefinierte JavaScript-Lösung

Alternativ, wenn ein jQuery-Plugin nicht gewünscht ist, können Sie kann eine benutzerdefinierte JavaScript-Funktion implementieren. Diese Funktion nutzt die Eigenschaften „selectionStart“ oder „selectionEnd“, abhängig von der Richtung der Auswahl.

function doGetCaretPosition(oField) {
  let iCaretPos = 0;

  if (oField.selectionStart || oField.selectionStart == '0')
    iCaretPos = oField.selectionDirection == 'backward' ? oField.selectionStart : oField.selectionEnd;

  return iCaretPos;
}

Diese Funktion kann einfach in Ihren Code integriert werden, indem Sie sie mit dem entsprechenden Eingabefeld als Argument aufrufen.

Implementierung

Sobald Sie die Cursorposition haben, können Sie damit verschiedene Aufgaben ausführen, z als:

• Text an der angegebenen Stelle einfügen
• Eine bestimmte Region hervorheben
• Textvalidierung basierend auf der Position des Caretzeichens durchführen

Das obige ist der detaillierte Inhalt vonWie kann ich die Cursorposition in einem Texteingabefeld ermitteln?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!