jquery dynamic slideToggle

Question

J'utilise le CMS SilverStrips. Mon but est de créer une série dynamique de divs qui se sont effondrés et qui ont des liens utilisés pour les développer. J'essaie d'utiliser la fonction jQuery slideToggle() et d'avoir un problème pour le faire fonctionner correctement sous forme de fonction. Voici ce que j'ai.

tag tête:

$(document).ready(function(){ 
    (function($){ 
     $.fn.collapse = function(itemid){ 
      $(itemid).slideToggle(); 
     }; 
    })(jQuery); 
}); 

Et j'ai mis les liens pour avoir un événement onclick qui appelle l'effondrement de la fonction() avec l'identifiant généré dynamiquement comme si:

<h3><a href"javascript:void(0)" onclick="collapse(div#itemid)">$Title</a></h3> 

Je suis Je ne sais pas si j'ai formaté ma fonction correctement ou non.

Answer 1

Je pense que votre problème est ici

<h3><a href"javascript:void(0)" onclick="collapse(div#itemid)">$Title</a></h3> 

Je crois qu'il devrait être

<h3><a href="javascript:void(0)" onclick="collapse('div#itemid')">$Title</a></h3> 

Assurez-vous que votre CSS initial ne pas

{height:0px;} 

il devrait avoir

à la place ou la bascule ne saura pas à quelle hauteur basculer.

---

Aussi, pourquoi ne pas créer votre fonction comme ceci?

$(document).ready(function(){ 

    function collapse(itemid){ 
     $(itemid).slideToggle(); 
    }; 

}); 

Answer 2

La façon dont vous créez cette fonction, vous devez l'appeler comme ceci:

$("any selector here").collapse("div#itemid") 

Ceci est probablement pas ce que vous voulez. Au lieu de cela, essayez ceci:

$.fn.collapse = function(){ 
     $(this).slideToggle(); 
    }; 

Ensuite, il peut être appelé comme ceci:

$('div#itemid').collapse() 

http://jsbin.com/ozacoq/1/edit

---

Idéalement, vous devriez également considérer ne pas attacher vos gestionnaires en ligne. Quelque chose comme ceci:

$("a.somelink").click(function(){ 
    $('div#itemid').collapse(); 
});