标签: jquery-boilerplate

我正在为我正在研究的项目编写一个JQuery插件,该项目从桌面设备上的标签内容转变为移动设备上的手风琴.我使用JQuery Boilerplate(https://github.com/jquery-boilerplate/jquery-boilerplate/blob/master/dist/jquery.boilerplate.js)作为我的插件的初始模式.

该插件在具有类".tabs2accordion"的任何元素上调用,如下所示:

 $(".tabs2accordion").tabs2Accordion({state:"desktop"});

如果页面上只有一个带有".tabs2accordion"类的元素,则插件会按预期工作,但只要将具有相同类的另一个元素添加到页面中,该插件就会出现故障.我已经创建了一个基本代码的codepen来演示这个问题.要显示此问题,请在窗口大小> 768px上尝试单击任何标题,并观察下面的内容在单击每个标题时如何更改.接下来取消注释HTML块并尝试再次单击标题.

http://codepen.io/decodedcreative/pen/MyjpRj

我尝试使用类"tabs2accordion"循环遍历每个元素,如下所示:

$(".tabs2accordion").each(function(){
    $(this).tabs2Accordion({state:"desktop"});
});

但这也没有解决问题.

有任何想法吗？