Question

I have this accordion function :

 $('.accordion a').click(function () {

        if($(this).is('.accordionClose')) {
            $('.accordionOpen').toggleClass('accordionOpen').toggleClass('accordionClose').next().slideToggle().toggleClass('openContent');
            $(this).toggleClass('accordionOpen').toggleClass('accordionClose');
            $(this).next().slideToggle().toggleClass('openContent');
        }

        else {
            $(this).toggleClass('accordionOpen').toggleClass('accordionClose');
            $(this).next().slideToggle().toggleClass('openContent');
        }
    });

I have this snippet to make a accordion effect. Problem is I am not aware how to make this a common function and call it whenever required. Do I need to make it in a plugin format ? Or any other possible way of doing it?

I am aware of using multiple selctors separated by comma. I do not mean that.

Was it helpful?

Solution

Write like this:

function func_name(){
//do stuff here
}

//call this later like this:

$('.accordion a').click(func_name);

//Or call like this:
$('.accordion a').click(function(){
  func_name(); //parenthesis required here
});

Also, you may look at another post for stepping up a little more.

OTHER TIPS

If you want to do exactly the same thing on some other click then You can also trigger the same click event by trigger like :

$(".xyz_class").click(function(){
   $(".accordion a").trigger("click");
});

Docs are here. Hope that helps.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top