Solved

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

Posted on 2009-05-14
8
349 Views
Last Modified: 2012-05-07
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
Comment
Question by:jackjohnson44
  • 3
  • 3
  • 2
8 Comments
 
LVL 14

Assisted Solution

by:ziffgone
ziffgone earned 200 total points
ID: 24387966
Easy:


$(document).ready(function() {

    $('#example_button').click(function() {

        standardFunction();

    });

});

function standardFunction(){

        window.alert("You clicked me!");

}

Open in new window

0
 
LVL 12

Expert Comment

by:alien109
ID: 24388062
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
 

Author Comment

by:jackjohnson44
ID: 24388321
Thanks, but can one of you tell me the difference in the .call?

Does that do anything extra for me?
0
 
LVL 14

Expert Comment

by:ziffgone
ID: 24388409
Not sure.

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

Regards...
0
6 Surprising Benefits of Threat Intelligence

All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

 
LVL 12

Expert Comment

by:alien109
ID: 24388513
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
 
LVL 12

Accepted Solution

by:
alien109 earned 300 total points
ID: 24388590
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
 

Author Closing Comment

by:jackjohnson44
ID: 31581617
Thanks Guys, good explanation alien!
0
 
LVL 14

Expert Comment

by:ziffgone
ID: 24389484
That's cool alien109, thanks...
0

Featured Post

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

I have answered several questions lately that were solved utilizing the power of jQuery's AJAX functions, so I thought I would write an article demonstrating the ease of use. Why should I use jQuery as opposed to regular JavaScript? Now I know…
Introduction Knockoutjs (Knockout) is a JavaScript framework (Model View ViewModel or MVVM framework).   The main ideology behind Knockout is to control from JavaScript how a page looks whilst creating an engaging user experience in the least …
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now