Hey, there! Look at our new WYSIWYG editor.
Documentation

Events

focus #

Arguments
e Objectthe focus event object

Triggered every time when Redactor gets focus.

$R('#content', {
    callbacks: {
        focus: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onfocus: function(e)
        {
            // ...
        }
    });
})(Redactor);

blur #

Arguments
e Objectthe blur event object

Triggered every time a blur event occurs, for example, on click outside of Redactor.

$R('#content', {
    callbacks: {
        blur: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onblur: function(e)
        {
            // ...
        }
    });
})(Redactor);

click #

Arguments
e Objectthe click event object

Triggered every time when Redactor gets a click event.

$R('#content', {
    callbacks: {
        click: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onclick: function(e)
        {
            // ...
        }
    });
})(Redactor);

keydown #

Arguments
e Objectthe keydown event object

Triggered on keydown in Redactor. Keydown callback is called before Redactor functions, that handle keydown.

$R('#content', {
    callbacks: {
        keydown: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onkeydown: function(e)
        {
            // ...
        }
    });
})(Redactor);

Next example allows to avoid handling keydown functions by Redactor and create custom functions for handling key inputs:

$R('#content', {
    callbacks: {
        keydown: function(e)
        {
            e.preventDefault();
            // .your keydown methods
            return false;
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onkeydown: function(e)
        {
             e.preventDefault();
             // .your keydown methods
             return false;
        }
    });
})(Redactor);

keyup #

Arguments
e Objectthe keyup event object

Triggered on keyup in Redactor. Keyup callback is called before Redactor functions, that handle keyup.

$R('#content', {
    callbacks: {
        keyup: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onkeyup: function(e)
        {
            // ...
        }
    });
})(Redactor);

enter #

Arguments
e Objectthe keydown event object

Triggered after Enter/Return key is pressed.

$R('#content', {
    callbacks: {
        enter: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onenter: function(e)
        {
            // ...
        }
    });
})(Redactor);

You can return false in this callback to prevent Redactor from handling Enter/Return key inputs. It allows you to develop custom handlers for this event.

$R('#content', {
    callbacks: {
        enter: function(e)
        {
            // .your enter methods
            return false;
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        onenter: function(e)
        {
            // your enter methods
            return false;
        }
    });
})(Redactor);

tab #

Arguments
e Objectthe keydown event object

Triggered after Tab key is pressed.

$R('#content', {
    callbacks: {
        tab: function(e)
        {
            // ...
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        ontab: function(e)
        {
            // ...
        }
    });
})(Redactor);

You can return false in this callback to prevent Redactor from handling Tab key inputs. It allows you to develop custom handlers for this event.

$R('#content', {
    callbacks: {
        tab: function(e)
        {
            // .your tab methods
            return false;
        }
    }
});

Listen to the message in a plugin:

(function($R)
{
    $R.add('plugin', 'myplugin', {
        init: function(app)
        {
            // define app
            this.app = app;
        },

        // messages
        ontab: function(e)
        {
            // your tab methods
            return false;
        }
    });
})(Redactor);