Call user defined function on click in jQuery

Question

I have made a jQuery function and want to call it on click event. My code is like below:

<script type="text/javascript">
    (function($){
        $.fn.my_function = function(options){
            return this.each(function(){
                alert("Hello");
            });
        };
    })(jQuery);

    $(document).ready(function(){
        $('#submit_buttom').my_function(); 
    });
</script>

Please help.

Thanks

jerjer · Accepted Answer · 2012-02-20 10:57:47Z

3

Try this:

 (function($){
        $.fn.my_function = function(options){
            var callback = function(){
                alert("Hello");
                //codes goes here
            };
            return this.each(function(){
                $(this).click(callback);
            });
        };
    })(jQuery);

    $(document).ready(function(){
        $('#submit_buttom').my_function(); 
    });

answered Feb 20, 2012 at 10:57

jerjer

8,77634 silver badges36 bronze badges

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

1 Comment

Dheeraj Agrawal Over a year ago

hi, thanks for the answer and its working fine. I have one more question: How should I call a function inside delegate? Is there anything like: $('body').delegate('#submit_button', my_function());

bang · Accepted Answer · 2012-02-20 10:58:07Z

3

<script type="text/javascript">
    (function($){
        $.fn.my_function = function(options){
            return this.each(function(){
                $(this).click(function(){
                  alert("Hello");
                });
            });
        };
    })(jQuery);

    $(document).ready(function(){
        $('#submit_buttom').my_function(); 
    });
</script>

answered Feb 20, 2012 at 10:58

bang

5,2711 gold badge28 silver badges31 bronze badges

4 Comments

Dheeraj Agrawal Over a year ago

hi, thanks for the answer and its working fine as well. I have one more question: How should I call a function inside delegate? Is there anything like: $('body').delegate('#submit_button', my_function());

bang Over a year ago

Just declare the function outside like: function Hello() { alert("Hello"); } and the use the function name as the delegate eg.: $("#button").click(Hello); or am I missunderstanding your question ?

Dheeraj Agrawal Over a year ago

Yeah you didn't get my question :). Actually my button is coming dynamically so to add any event or to use if I have to use delegate like $('body').delegate('#submit_button', 'click', function(){}); but here I want to call my_function() when I click that button. Now you get what I want to say?

bang Over a year ago

If you are using latest jquery version (1.7) then you should use On() instead. I'm still not sure I understand what you mean, but if you just want to call a function declared somewhere else it's the same solution as my previous comment. $("body").on("click", "#submit_button", Hello);

Aram Kocharyan · Accepted Answer · 2012-02-20 11:00:15Z

2

You can use the .click() event handler:

$('#submit_buttom').click(function(){
    // Can be any function call, but must be within an asynchronous/anonymous function 
    my_function();
});

answered Feb 20, 2012 at 11:00

Aram Kocharyan

20.5k11 gold badges84 silver badges98 bronze badges

Comments

Nicholas Smith · Accepted Answer · 2012-02-20 10:59:35Z

0

Try using the .click() function: described here on the Getting started with jQuery tutorial

answered Feb 20, 2012 at 10:59

Nicholas Smith

11.8k7 gold badges40 silver badges58 bronze badges

Collectives™ on Stack Overflow

Call user defined function on click in jQuery

4 Answers 4

1 Comment

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related