Skip to main content

jQuery Installation

@editor42/editor42-jquery is a thin wrapper around Editor42 that makes it a jQuery plugin. There is no account, no sign-up and no key of any kind.

It patches .val(), .html(), .text(), .append(), .prepend(), .remove(), .empty() and .attr() so they work naturally against editor-bound elements — reading from and writing to the editor instead of the hidden textarea underneath it.

Install​

npm install @editor42/editor42-jquery

or for Yarn users:

yarn add @editor42/editor42-jquery

Basic Setup​

Load jQuery first, then the integration:

<script src="jquery.min.js"></script>
<script src="node_modules/@editor42/editor42-jquery/dist/editor42-jquery.js"></script>

<textarea id="editor"></textarea>
<script>
$('#editor').editor42({ height: 400 });
</script>

With no script_url the editor script is loaded from https://cdn.editor42.com on the latest channel. That pointer only ever moves for security and bug-fix releases, because the Editor42 major version is fixed forever.

Reading and Writing the Content​

Once an element is bound, the usual jQuery accessors talk to the editor:

$('#editor').html();                     // the editor's HTML
$('#editor').html('<p>New content</p>'); // replaces it

$('*:editor42'); // every element bound to an editor

Self-Hosting​

$('#editor').editor42({ script_url: '/js/editor42/editor42.min.js' });

Any full script URL works.

Pinning a Version​

$('#editor').editor42({ channel: '42.0.0' });

channel accepts latest, a latest-N alias, or an exact version.

Editor Options​

Everything else is an Editor42 option, passed in the same settings object:

$('#editor').editor42({ height: 400, menubar: false, plugins: 'lists link' });

See the Configuration Options for the full list.

Migrating from @tinymce/tinymce-jquery​

npm uninstall @tinymce/tinymce-jquery
npm install @editor42/editor42-jquery

$(el).tinymce(settings) and the :tinymce pseudo keep working as deprecated aliases of $(el).editor42(settings) and :editor42. script_url, channel, script_loaded and oninit keep their names, and TinyMCE-style numeric channels resolve to latest.

All API-key and licence-key handling has been removed. The api_key setting is still accepted so existing code compiles, but it does nothing: no key is read, stored or sent anywhere, and no request ever reaches a vendor cloud.

The integration also drives a stock TinyMCE if that is what is already loaded on the page, which keeps the switch reversible.

See the migration guide for the editor side of the move.

Live Demo​

See it running, with its full source: the jQuery demo.