Join events keypress (with keyCode) and click on link

Question

My question is simple but I didn't find any solution.

I've one function:

function toggleLabels(){
    $(".hideable").toggle();
    if($(this).parent().parent().hasClass("selected")) {
        $(this).parent().parent().removeClass("selected");
        $('.preview-toggle .message').text('hide options');
    } else {
        $(this).parent().parent().addClass("selected");
        $('.preview-toggle .message').text('show options');
    }
}

that I would like to call by two different events:

    $(document).keypress(function(e) {
        if (e.keyCode == 113) { ....

and

    $('.preview-toggle a').click(function() {

Is it possible join the events? I've tried .bind() but without any positive result :(

Thank you. Fabio

After trying your suggestions, I've decide to separate events and choose this format:

var toggleLabels = function(){
        $(".hideable").toggle();
        if($('.preview-toggle').hasClass("selected")) {
            toggleMargins("show");
            $('.preview-toggle').removeClass("selected");
            $('.preview-toggle .message').text('hide options');
        } else {
            toggleMargins("hide");
            $('.preview-toggle').addClass("selected");
            $('.preview-toggle .message').text('show options');
        }
    }
    $('.preview-toggle a').click(function() {
        toggleLabels()
    });
    $(document).keydown(function(e) {
        if (e.keyCode == 113) {
            toggleLabels()
        }
    });

Answer 1

Since both events are triggered on different elements ('.preview-toggle a' and document) and have different types you can't join them. Because the click-event bubbles up the DOM and reaches the document, you can set the handler to document like so:

var links = $('.preview-toggle a');
$(document).on('keypress click', function(event) {
    if (event.keyCode == 113 || event.type == 'click' && links.index(event.target) > -1)
        toggleLabels();
});

But note that jQuery under the hood sets two listeners on document, one for 'keypress' and one for 'click'. The only other way is to use the same function as callback in each handler:

$('.preview-toggle a').click(toggleLabels);
$(document).keypress(function(e) {
    if (e.keyCode == 113) toggleLabels();
})

Note also that in both ways the this-keyword inside toggleLabels points to different elements. You have possibly to replace $(this) with $("someSelector"):

As an aside: You should not create jQuery-objects with same content multiple times. If you need it more than once store it in a variable and reference to that var:

function toggleLabels(){
    $(".hideable").toggle();
    var par = $(this).parent().parent(); // store jQuery object here
    if(par.hasClass("selected")) { // reference to variable par
        par.removeClass("selected"); // reference again
        $('.preview-toggle .message').text('hide options');
    } else {
        par.addClass("selected");
        $('.preview-toggle .message').text('show options');
    }

}