How to set focus on the ace editor?

问题

I am using the ace editor component from ajax.org inside a jquery tab interface. Each tab will contain a separate ace editor. Whenever I switch to a new tab, the editor in it won't get the focus.

I can detect when a tab is selected by binding to the "tabsshow" event of jquery UI. Does any one know how to set focus to the editor in it if say the id of my editor div is editor-tab-0 for the first tab, and so on...?

Please can some one help?

回答1:

editor.focus(); //To focus the ace editor
var n = editor.getSession().getValue().split("\n").length; // To count total no. of lines
editor.gotoLine(n); //Go to end of document

回答2:

To focus to the end:

editor.focus();
editor.navigateFileEnd();

Thanks to @a-user

回答3:

Nice solution, but I wanted to go to the end of the last line not the beginning of the last line.

//To focus the ace editor
editor.focus();
session = editor.getSession();
//Get the number of lines
count = session.getLength();
//Go to end of the last line
editor.gotoLine(count, session.getLine(count-1).length);

回答4:

Here's an excerpt from my code that sets the focus on an Ace edit session in a jQuery UI tab:

    $('#tabs_div').tabs(
        {
            select : function(event, ui) {
                        var tabName = ui.panel.id;
                        var doc = docs.get(tabName);  // look up the EditSession
                        var session = env.split.setSession(doc);
                        session.name = tabName;
                        env.editor.focus();
            }

回答5:

I use JQuery with the Ace Editor, and I found the following code worked really nicely for me. PS: My Code Editor Window is in an Iframe:

$('#modelFrame').mouseover(function() {
    try {
        $(this).get(0).contentWindow.editor.focus();
    } catch (doNothing) {
        ;;
    }
});

来源：https://stackoverflow.com/questions/7050931/how-to-set-focus-on-the-ace-editor

标签

javascript

jquery

jquery-ui

ace-editor