Question

Right now I have this

jQuery('.widget-prop').keyup(function() {
    var prop = jQuery(this).attr('id');
    var val = jQuery(this).val();

    stuff;
}

and

jQuery('.widget-prop').click(function() {
    var prop = jQuery(this).attr('id');
    var val = jQuery(this).val();

    stuff;
}

two functions are the same, so I’d like to simplify it by defining external function and calling it with

jQuery('.widget-prop').click('myFunction');

but how would I pass parameters to myFunction?

function myFunction(element) {
    stuff;
}

Thanks

Answer 1

Firstly you can combine both your handlers into one:

jQuery('.widget-prop').on('click keyup', function() {
    var prop = jQuery(this).attr('id');
    var val = jQuery(this).val();
    // stuff;
});

Or for older versions of jQuery:

jQuery('.widget-prop').bind('click keyup', function() { // ... });

Secondly, jQuery will automatically apply the current element to any function you provide, so the this keyword will still be the element raising the event when you do this:

jQuery('.widget-prop').on('click keyup', myHandler);

function myHandler() {
    var prop = jQuery(this).attr('id');
    var val = jQuery(this).val();
    // stuff;
}