Wie bewege ich den Cursor an das Ende eines ContentEditable-Elements?

Cursor an das Ende eines inhaltsbearbeitbaren Elements bewegen

Sind Sie schon einmal auf die Notwendigkeit gestoßen, den Cursor an das Ende eines inhaltsbearbeitbaren Elements zu positionieren, ähnlich dem Funktion, die im Notizen-Widget von Gmail angezeigt wird?

Die Lösung

Für inhaltsbearbeitbare Elemente ist die Lösung von Geowa4 nicht anwendbar. Ein maßgeschneiderter Ansatz ist erforderlich:

function setEndOfContenteditable(contentEditableElement) {
  var range, selection;
  if (document.createRange) {
    // Modern browsers
    range = document.createRange();
    range.selectNodeContents(contentEditableElement);
    range.collapse(false);
    selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range);
  } else if (document.selection) {
    // IE 8 and below
    range = document.body.createTextRange();
    range.moveToElementText(contentEditableElement);
    range.collapse(false);
    range.select();
  }
}

Um es anzuwenden, folgen Sie einfach dem Codebeispiel:

var elem = document.getElementById("txt1");
setEndOfContenteditable(elem);

Kompatibilität

Diese Lösung ist kompatibel mit allen gängigen Browsern, die Contenteditable unterstützen.

Das obige ist der detaillierte Inhalt vonWie bewege ich den Cursor an das Ende eines ContentEditable-Elements?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!