Javascript 关闭jQuery accordian插件中打开的div，然后打开单击的div

尽管有几十个jQuery accordian插件，但我想为我正在进行的项目创建一些自定义插件。不管怎么说，这里的一切都是小提琴手——除了我想添加一个布尔选项，即如果其他手风琴div打开，那么首先关闭它们，因为它们应该立即关闭，或者滑动，然后打开悬停或单击的一个。以下是我的JS代码：

    (function($) {
    $.fn.extend({
        //PLUGIN NAME
        accordian: function(options) {
            //DEFAULT VARIABLES        
            var defaults = {
                imageShow: '',
                openOnload: 'no',
                imageHide: '',
                actionType: 'instant',
                speed: 500,
                userActionType: 'click',
                openAndCloseArea: ''
            };
            var options = $.extend(defaults, options);
            return this.each(function() {
                var o = options;
                var obj = $(this);
                var openAndCloseArea = $(o.openAndCloseArea);
                var imageShow = $(o.imageShow);
                var imageHide = $(o.imageHide);
                var openOnload = o.openOnload;
                var actionType = o.actionType;
                var speed = o.speed;
                var userActionType = o.userActionType;
                var animationDone = true;
                //START SCRIPT ENGINE
                //BELOW SETS ONLOAD SETTINGS BASED ON ABOVE VARIABLES
                var instant = function(type, openAndCloseArea, obj, imageHide, imageShow) {
                        if (type === 'instantShow') {
                            openAndCloseArea.css('display', 'block');
                            openAndCloseArea.data("name", "show");
                            obj.addClass('activeSA');
                            openAndCloseArea.addClass('activeSAArea');
                            imageHide.show();
                            imageShow.hide();
                        }
                        if (type === 'instantHide') {
                            openAndCloseArea.css('display', 'none');
                            openAndCloseArea.data("name", "hide");
                            obj.removeClass('activeSA');
                            openAndCloseArea.removeClass('activeSAArea');
                            imageHide.hide();
                            imageShow.show();
                        }
                    }
                var slide = function(type, openAndCloseArea, obj, imageHide, imageShow) {
                        if (type === 'slideShow') {
                            openAndCloseArea.data("name", "show");
                            openAndCloseArea.addClass('activeSAArea');
                            obj.addClass('activeSA');
                            imageHide.show();
                            imageShow.hide();
                        }
                        if (type === 'slideHide') {
                            openAndCloseArea.data("name", "hide");
                            obj.removeClass('activeSA');
                            openAndCloseArea.removeClass('activeSAArea');
                            imageHide.hide();
                            imageShow.show();
                        }
                    }
                    //DOES INITIAL ONLOAD WORK
                if (openOnload === false) {
                    instant('instantHide', openAndCloseArea, obj, imageHide, imageShow);
                } else {
                    instant('instantShow', openAndCloseArea, obj, imageHide, imageShow);
                }
                obj.on(userActionType + ".accordian", function(event) {
                    //INSTANTLY SHOWS
                    if (actionType === 'instant') {
                        var boxStatus = openAndCloseArea.data("name");
                        if (boxStatus === 'hide') {
                            instant('instantShow', openAndCloseArea, obj, imageHide, imageShow);
                            return false;
                        } else {
                            instant('instantHide', openAndCloseArea, obj, imageHide, imageShow);
                            return false;
                        }
                    }
                    //DOES SLIDE EFFECT
                    if (actionType === 'slide' && animationDone === true) {
                        animationDone = false;
                        var boxStatus = openAndCloseArea.data("name");
                        if (boxStatus === 'hide') {
                            openAndCloseArea.slideDown(speed, function() {
                                animationDone = true;
                            });
                            slide('slideShow', openAndCloseArea, obj, imageHide, imageShow);
                            return false;
                        } else {
                            openAndCloseArea.slideUp(speed, function() {
                                animationDone = true;
                            });
                            slide('slideHide', openAndCloseArea, obj, imageHide, imageShow);
                            return false;
                        }
                    }
                });
            });
        }
    });
})(jQuery);

我认为你应该为你的整个手风琴，而不是调用每个元素的函数

然后在每个链接上使用以选择要打开的节。或使用

这样你就有了一个包装器，现在你可以简单地调用它。；在打开一个之前

编辑： 如果必须使用变量和布尔表达式，请查看

可能类似sessionStorage.accordion\u current=+openAndCloseArea.id

和$sessionStorage.accordion\u current.hide

---

注意，您需要支持的浏览器。

神圣变量，蝙蝠侠！我不知道还有多少其他人，但我刚才提到的是由制作jQuery的人制作的。是的，您可以将它作为一个单独的组件来获得，而不必拥有所有的jQueryUI。如果这是为了一份工作，仅仅从经验上讲，你没有时间重新发明轮子，只需要去获得jQueryUI版本的它，然后继续前进。