Can’t Listen to KeyDown in TInyMCE Iframe (jQuery) and Pass it to Parent HTML FORM

As it turns out, it’s not that difficult, we need to add a JS function inside the TinyMCE init, to make it possible. My approach used WordPress’s TinyMCE before init function, to add JS to the TinyMCE, Iframe.

Below is the code, this code should go into your Child Theme’s functions.php or in a custom plugin


add_filter( 'tiny_mce_before_init', 'wpse24113_tiny_mce_before_init' );
function wpse24113_tiny_mce_before_init( $initArray )
{
    $initArray['setup'] = <<<JS
[function (editor) {
        editor.on('keyDown', function (e) {
    
  if((e.ctrlKey || e.metaKey) && e.which == 83) {
      e.preventDefault();
    jQuery('.action-save').click();
  }
        });
    }][0]
JS;
    return $initArray;
}

This code adds js to iframe. It listens for the keydown function, and then clicks the Save Button, as intended, and shall work perfectly fine.