Question

I wrote a simple WordPress plugin the other day that saves a post and shows a preview. Here is the javascript.

jQuery(document).ready(function($){

if (document.cookie.indexOf("previewCookie") >= 0){  
    //expires added for IE
    document.cookie="previewCookie=true; max-age=0;expires=0;path=/wp-admin/";          

    //quickPreviewOption is set in quick-preview.php  
    var previewURL = document.getElementById('post-preview');
    if(quickPreviewOption === 'current'){                                           
        window.location = previewURL;
    }
    if(quickPreviewOption === 'new'){
        window.open(previewURL,"wp_PostPreview","","true");
    }
}

$(document).keydown(function(e){
    if((e.ctrlKey || e.metaKey) && e.which == 83){

        //Find #save post if it's a draft. If post is published, #save-post doesn't exist.
        if($('#save-post').length){
            $('#save-post').click();    
        }
        else if($('#publish').length){
            $('#publish').click();
        }

        //Sets a cookie to open the preview on page refresh. Saving a post auotmatically refreshes the page.
        document.cookie = "previewCookie = true;max-age = 60;path=/wp-admin/";      
        return false;           
    }

}); 
});

This works when using the “html” editor in wordpress. However, using the “visual” editor in WordPress I can’t get any keydown function to fire. Not ctrl-s, ctrl-q etc. I don’t know what’s blocking it and I can’t find it in the source. I tried unbinding all keydown events and then rebinding only mine it didn’t unbind the WordPress keydown event. Anyone have any ideas?

Here’s the link to quick-preview plugin in case it helps. http://wordpress.org/extend/plugins/quick-preview/

Answer 1

I’m posting a link to an answer that worked for me since no one else has answered this. Tiny MCE has it’s own keydown function which you have to hook into when WordPress initializes tinyMCE. The answer here worked for me. https://wordpress.stackexchange.com/questions/24113/hook-the-keydown-event-in-the-tinymce-post-editor