在打開一個點擊之前關閉jQuery的開放式div插件

雖然有幾十個jQuery的手風琴插件，我想爲我正在開發的一個項目創建一些自定義的東西。無論如何一切正常（這裏是提琴手 - http://jsfiddle.net/sunnyday195/g9SvF/），除了我想添加布爾選項，如果其他的手風琴divs打開，然後首先關閉那些，因爲他們應該關閉（即時或幻燈片），然後打開一個懸停或點擊。這裏是我的JS代碼：在打開一個點擊之前關閉jQuery的開放式div插件

(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);

來源

2013-08-02 Sunny Day

神聖變數，蝙蝠俠！ – SpYk3HH

[你明白了，你在重新發明輪子嗎？]（http://api.jqueryui.com/accordion/）我不知道那些「其他幾十個人」，但我剛纔引用的那個由製作jQuery的相同人員來完成。是的，你可以把它作爲一個單獨的組件，而不必擁有所有的jQueryUI。如果這是一個「工作」，只是從經驗上講，你沒有時間重新發明輪子，只需要獲取它的jQueryUI版本並繼續前進。 – SpYk3HH

我想你應該<div></div>在您的整個手風琴，而不是調用函數的每個元素。

比在每個鏈接上使用data-選擇要打開的部分。（或使用.next("p")）

這種方式，你有一個包裝，現在ü可以打開一個以前只需撥打.children("p").hide();。

編輯： 如果必須使用變量和布爾表達式去，看看sessionStorage。

大概就像sessionStorage.accordion_current = "#"+openAndCloseArea.id

和$(sessionStorage.accordion_current).hide();

注意到你需要支持的瀏覽器。

來源

2013-08-02 21:00:03 mtbnunu

在打開一個點擊之前關閉jQuery的開放式div插件

回答

相關問題