2017-05-25 65 views
0

我正在檢查jQuery的ui,而代碼的工作原理是如何,我不知道它是否可以縮短。 我試圖自己做,但一直未能。我將不勝感激任何幫助。我該如何縮短這個jQuery代碼?

我該如何縮短這段代碼?

JQUERY: 

    $(function() { 
     $("#accordion").accordion({ 
      collapsible: true, 
      active: 'none' 
     }); 
    }); 

    $(function() { 
     var icons = { 
      header: "ui-icon ui-icon-plus", 
      activeHeader: "ui-icon ui-icon-minus" 
     }; 
     $("#accordion").accordion({ 
      icons: icons 
     }); 
     $("#toggle").button().on("click", function() { 
      if ($("#accordion").accordion("option", "icons")) { 
       $("#accordion").accordion("option", "icons", null); 
      } else { 
       $("#accordion").accordion("option", "icons", icons); 
      } 
     }); 
    }); 

    $("#tabs").tabs({ 
     disabled: [2, 3] 
    }); 

    $("#tabs").tabs({ 
     hide: { 
      effect: "drop", 
      duration: 750 
     } 
    }); 

    $("#tabs").tabs({ 
     show: { 
      effect: "drop", 
      duration: 750 
     } 
    }); 

    $("#tabs").tabs({ 
     heightStyle: "auto" 
    }); 
+0

你可以添加html代碼和代碼的功能。它很好有一個小提琴示例 –

+0

你只需要將你的代碼包裝在一個'$(function(){});'中。所以有一件事。 – Twisty

+0

爲'.tabs()'指定選項時,您使用的是相同的選擇器,因此相同的元素只需將其放入一個。除非你打算製作3組不同的標籤。 – Twisty

回答

0

這裏都是我的意見建議的項目:

https://jsfiddle.net/Twisty/ywx0yrub/

的JavaScript

$(function() { 
    var icons = { 
    header: "ui-icon ui-icon-plus", 
    activeHeader: "ui-icon ui-icon-minus" 
    }; 
    $("#accordion").accordion({ 
    collapsible: true, 
    active: 'none', 
    icons: icons 
    }); 
    $("#toggle").button().click(function() { 
    if ($("#accordion").accordion("option", "icons")) { 
     $("#accordion").accordion("option", "icons", null); 
    } else { 
     $("#accordion").accordion("option", "icons", icons); 
    } 
    }); 
    $("#tabs").tabs({ 
    disabled: [2, 3], 
    hide: { 
     effect: "drop", 
     duration: 750 
    }, 
    show: { 
     effect: "drop", 
     duration: 750 
    }, 
    heightStyle: "auto" 
    }); 
}); 
  1. 總結所有的代碼在一個
  2. 在單個語句中定義初始化的所有部分
  3. 由於您的按鈕是靜態的,因此不需要使用.on()。這沒有錯,但您可以通過使用.click()來縮短它。

希望有所幫助。

+0

謝謝,這非常有幫助 – Zevothan