jquery - plugin bubble click event

i'm trying to create my own jquery plugin but am having problems bubbling the event to the page (I think this is the problem).

I am calling the plugin like so.

$('div.testdiv1').bpcolourpicker
({
    onClick: onClickCallback
});

var onClickCallback = function ()
{
    //alert('testpage');
开发者_Go百科}

PLUGIN CODE-

    var defaults =
    {
        returncolour: 'ff0000',
        showtextbox: true,
        onClick: function () { }
    };
    var options = $.extend(defaults, options);



    var onClick = function ()
    {
        // default
    }

    // Select a colour
    $(thisdiv).find('div.bpcolourpicker table.colours div').click(onClick, function ()
    {
        var divtitle = RGBToHex($(this).attr('title'));
        $(thisdiv).find('input#chosencolour').val(divtitle);
    });

So what I want to happen is when the click method is fired, I want to bubble that event to the main page as i'm calling 'onClick: onClickCallback' so I would have thought onClickCallBack would handle the event.

Can anyone help?

Thanks in advance.

You're passing onClickCallback before you set the variable.

Your code is failing the same way as

alert(num);
var num = 3;

If you change the callback to a function statement, such asfunction onClickCallback() { ... }, it will work. Function statements are usable before their definitions, unlike normal variables.

Also, you cannot add two event handlers by passing two parameters to .click().
Instead, you should explicitly call onClick() from your handler.