[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 361
  • Last Modified:

jQuery how do you attach a function to a click event, not a delegate?

I want to attach a function to a click event, but I don't want to write an inline function since I might want to call the same fuction from two places.

I know how to do this:
$(document).ready(function() {
    $('#example_button').click(function() {
        window.alert("You clicked me!");
    });
});


How do I do this:
$(document).ready(function() {
    $('#example_button').click(standardFunction());
}

function standardFunction(){
        window.alert("You clicked me!");
}
0
jackjohnson44
Asked:
jackjohnson44
  • 3
  • 3
  • 2
2 Solutions
 
ziffgoneCommented:
Easy:


$(document).ready(function() {
    $('#example_button').click(function() {
        standardFunction();
    });
});
function standardFunction(){
        window.alert("You clicked me!");
}

Open in new window

0
 
alien109Commented:
Another thing you can do is call the function within the scope of the button

$(document).ready(function() {
    $('#example_button').click(function() {
        standardFunction.call(this);
    });
});
function standardFunction(){
        window.alert("You clicked me!");
}
0
 
jackjohnson44Author Commented:
Thanks, but can one of you tell me the difference in the .call?

Does that do anything extra for me?
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
ziffgoneCommented:
Not sure.

@alien109: What would the benefit be of using ".call"?

Regards...
0
 
alien109Commented:
using call, allows you to call a function within the scope of an object.

For example:

function test() {
    alert(this.color);
}

a = {color:"red"};
b = {color:"blue"};

test.call(a) // would result in an alert with the text "red"
test.call(b) // would result in an alert with the text "blue"

So in your standardFunction, you say, "you clicked me!". However you don't actually know who "me" is. So, by using call, the function can get executed in the scope of the button object that was clicked. Using the keyword "this" within that function would reference the button object. In other words, the "me" in this case would actually be the button object: $('#example_button')
0
 
alien109Commented:
Sometimes I don't explain stuff well... So I apologize if I'm not making sense.

Essentially the reason you MAY want to do this (I'm not saying you do!) is so that if you want to actually do something to the button that was clicked, you'd need to know which button you clicked. By using call, you can simply refer to the button that was clicked, by using "this" within the function.
0
 
jackjohnson44Author Commented:
Thanks Guys, good explanation alien!
0
 
ziffgoneCommented:
That's cool alien109, thanks...
0

Featured Post

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 3
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now