How to pass argument to a jquery function through an onClick event?

Question

Possible Duplicate:
jquery .click pass parameters to user function

    $('#topleft').click(function (x) {
    loadPopupBox();
    $("#popupinner").load('getdetail.php?id=' +x);
    });

How to pass a value to the variable x from an onclick event? The value of the variable x is POSTED to getdetail.php and the data returned from the getdetail.php is loaded to a DIV with ID popupinner. Now everything works except the data POST/GET.

Answer 1

Try using the .click syntax as .click( [eventData], handler(eventObject) ).

See below,

//                    v- Pass data
$('#topleft').click({x:x}, function (event) {
    loadPopupBox();
    $("#popupinner").load('getdetail.php?id=' + event.data.x); //read data from event obj
});

The [eventData] x can be accessed as event.data.x

Answer 2

You can provide eventData to the click function :

$('#topleft').click({x:x}, function (e) {
    loadPopupBox();
    $("#popupinner").load('getdetail.php?id=' +e.datax);
});

Answer 3

// say your selector and click handler looks something like this...
$("some selector").click({param1: "Hello", param2: "World"}, cool_function);

// in your function, just grab the event object and go crazy...
function cool_function(event){
    alert(event.data.param1);
    alert(event.data.param2);
}

As seen in jQuery's .click - pass parameters to user function

Answer 4

What you need is click event handler. See this question to know about how it works actually.