call user defined function in jquery

Question

Hi,

I am trying to call user defined function in jquery.

$(document).ready(function() {
 $('#btnSun').click(function(){
  myFunction();
 });
 $.fn.myFunction = function() { 
     alert('hi'); 
 }
});

I tried following as well

function myFunction()
{
alert('hi');
}

but it doesn't seems to work !! Any idea where I am wrong?

Regards, Priti

Answer 1

Try this $('div').myFunction();

This should work

$(document).ready(function() {
 $('#btnSun').click(function(){
  myFunction();
 });

function myFunction()
{
alert('hi');
}
 });

Answer 2

They are called plugins, as Jaboc commented. To make sense, plugin function should do something with the element it is called through. Consider the following:

jQuery.fn.make_me_red = function() {
    return this.each(function() {
        this.style.color = 'red';
    });
};

$('a').make_me_red();

Answer 3

If you want to call a normal function via a jQuery event, you can do it like this:

$(document).ready(function() {
  $('#btnSun').click(myFunction);
});
function myFunction() {
  alert('hi');
}

Answer 4

jQuery.fn.make_me_red = function() { return this.each(function() { this.style.color = 'red'; }); };

$('a').make_me_red() - instead of this you can use $(this).make_me_red() instead for better readability.