jQuery On() eventHandler parameter as a function name with parameter

Question

From jQuery website:

.on( events [, selector ] [, data ], handler(eventObject) )

How can i write a correct code to pass a parameter from ON method to the event handler Function...

I want a code like this:

myfunc =function(obj){
$(this).after("<p>Another paragraph! "+obj+"</p>");
}

var count = 0;
$("body").on("click", "p",myfunc(++count) );

enter image description here

Community · Accepted Answer · 2020-06-20 09:12:55Z

4

myfunc =function(event){
    $(this).after("<p>Another paragraph! "+event.data+"</p>");
}

$("body").on("click", "p", ++count, myfunc);

The data you send is being inserted to the event object:

data

Data to be passed to the handler in event.data when an event is triggered.

docs

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Apr 26, 2013 at 14:21

gdoron

151k59 gold badges302 silver badges376 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

gdoron Over a year ago

@Nelson, it works just fine, this is how you pass values, if you want the value to change, you will need to use different methods then the OP asked.

Nelson Benítez León Over a year ago

Ok, I didn't understand the question right then.. sorry for the noise.

Ramin Bateni Parvar Over a year ago

it is ok, but i want to increment the count every time the P is clicked, not cache the value

gdoron Over a year ago

@Ram, then use James's answer.

Ramin Bateni Parvar Over a year ago

i want define the function out of ON() method and set it as the eventHandler

|

James Montagne · Accepted Answer · 2013-04-26 14:51:14Z

3

Assuming you intend to increment the count on every click:

var count = 0;
$("body").on("click", "p",function(){
    $(this).after("<p>Another paragraph! " + (++count) + "</p>");
});

Edit, if you want your function to be separate and don't want to change it, you can do this:

myfunc = function(obj){
    $(this).after("<p>Another paragraph! "+obj+"</p>");
}

var count = 0;
$("body").on("click", "p",function(){
    myfunc.call(this, ++count);
});

http://jsfiddle.net/Bwk3W/

edited Apr 26, 2013 at 14:51

answered Apr 26, 2013 at 14:21

James Montagne

78.9k14 gold badges115 silver badges132 bronze badges

7 Comments

gdoron Over a year ago

That doesn't equal to the code he tried, your code doesn't save the value of count, it can change before the event will fire.

James Montagne Over a year ago

@gdoron that's what the 2nd bit in the answer is about. Though lookign at it again, I think both of our answers are wrong. I believe he wants to increment the count on every click, not cache the value.

gdoron Over a year ago

+1, well it seams that he wants your answer, I'll give my answer live because It better answer the question text...

Ramin Bateni Parvar Over a year ago

@JamesMontagne, i know your answe is correct, but i want an answer like gdoron answer

James Montagne Over a year ago

@RAM Updated my answer. If this isn't what you want either then you'll need to explain your question better.

|

Collectives™ on Stack Overflow

jQuery On() eventHandler parameter as a function name with parameter

2 Answers 2

8 Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related