Documentation

editor.focus()

Moves keyboard focus into the editor so the user can start typing without clicking first. Use it after the editor is created, after inserting content programmatically, or after closing a dialog or side panel that took focus away from the editing area.

Syntax

editor.focus()

Parameters

None.

Returns

Nothing (undefined).

Behavior notes

focus() is not a thin wrapper around the native DOM focus call — it accounts for the editor's different modes and for browser selection quirks:

  • Code mode. While the editor is showing HTML source, focus is routed to the code editor rather than the rich-text area, so the call still does the right thing in either mode.
  • A selected control wins. If a control such as an image is currently selected, focus() returns without changing anything. This is deliberate: it prevents a programmatic focus call from silently dropping the user's image selection (and the resizing handles that go with it).
  • The caret is preserved. Some browsers discard the current selection when focus moves into the editing frame. The editor re-applies the stored range afterwards, so the caret stays where the user left it instead of jumping to the top of the document.

Example usage

Focus the editor as soon as it is ready, so the page is immediately typable:

var editor1 = new RichTextEditor("#div_editor1");
editor1.focus();

Insert a snippet, then return focus to the editor so typing continues naturally:

document.getElementById("btn_signature").onclick = function () {
    editor1.insertHTML("<p>-- <br/>Sent from RichTextEditor</p>");
    editor1.focus();   // the button took focus on click; give it back
};

Focus after revealing a hidden editor. Focusing an element that is still display:none does nothing, so reveal it first:

function openComposer() {
    document.getElementById("composer").style.display = "block";
    editor1.focus();
}

Related