是否存在所有月份的javascript switch语句片段

-1

我试图显示当前月份的选项卡式窗格。使用Bootstrap的选项卡方法。想知道是否有人在这段代码中看到任何缺陷？到目前为止它的工作方式是如何使用和测试自己。是否存在所有月份的javascript switch语句片段

的HTML

<ul class="nav nav-tabs" id="monthsTab"> 
    <li><a href="#January" id="janLink" data-toggle="tab">January</a></li> 
    <li><a href="#February" id="febLink" data-toggle="tab" >February</a></li> 
    <li><a href="#March" id="marLink" data-toggle="tab">March</a></li> 
    <li><a href="#April" id="aprLink" data-toggle="tab">April</a></li> 
    <li><a href="#May" id="mayLink" data-toggle="tab">May</a></li> 
    <li><a href="#June" id="junLink" data-toggle="tab">June</a></li> 
    <li><a href="#July" id="julLink" data-toggle="tab">July</a></li> 
    <li><a href="#August" id="augLink" data-toggle="tab">August</a></li> 
    <li><a href="#September" id="sepLink" data-toggle="tab">September</a></li> 
    <li><a href="#October" id="octLink" data-toggle="tab">October</a></li> 
    <li><a href="#November" id="novLink" data-toggle="tab">November</a></li> 
    <li><a href="#December" id="decLink" data-toggle="tab">December</a></li> 
</ul>

而JS：

var currentMonth = function() { 
     var myMonth=new Date(); 
     var theMonth = myMonth.getMonth(); 
     var target = ''; 
     var month = ''; 
     switch (theMonth) { 
     case 0: 
      target = "janLink"; 
      month = "January"; 
     break; 
     case 1: 
      target = "febLink"; 
      month = "February"; 
     break; 
     case 2: 
      target = "marLink"; 
      month = "March"; 
     break; 
     case 3: 
      target = "aprLink"; 
      month = "April"; 
     break; 
     case 4: 
      target = "mayLink"; 
      month = "May"; 
     break; 
     case 5: 
      target = "junLink"; 
      month = "June"; 
     break; 
     case 6: 
      target = "julLink"; 
      month = "July"; 
     break; 
     case 7: 
      target = "augLink"; 
      month = "August"; 
     break; 
     case 8: 
      target = "sepLink"; 
      month = "September"; 
     break; 
     case 9: 
      target = "octLink"; 
      month = "October"; 
     break; 
     case 10: 
      target = "novLink"; 
      month = "November"; 
     break; 
     case 11: 
      target = "decLink"; 
      month = "December"; 
     break; 
     } 
     $('#monthsTab, ' + '#' + target).parent().addClass('active'); 
     $('#'+month).addClass('active'); 
    }; 
    currentMonth();

来源

2013-01-07 asherrard

http://codereview.stackexchange.com/是发布未被破坏的代码的适当位置。 – Blazemonger

你可以使用一个数组来代替这个巨大的开关。 –

可能的重复http://stackoverflow.com/q/1643320/901048 – Blazemonger

相反那loooooooooooong开关壳体的我会使用对象的数组：

var months = [ 
    {name: "January" , link: "janLink"}, 
    {name: "February" , link: "febLink"}, 
    ... 
]; 

var currentMonth = function() { 
    var myMonth = new Date(); 
    var theMonth = myMonth.getMonth(); 
    $('#monthsTab, #' + months[theMonth].link).parent().addClass('active'); 
    $('#' + months[theMonth].name).addClass('active'); 
};

来源

2013-01-07 18:13:24 Neal

要也显示一个正确的内容，你应该在选择的标签上触发一个点击事件。你写了很长Ø代码这样的任务 - 只要标签是为了你能确定由以激活该标签（看jQuery.eq()）

$('#monthsTab li').eq(myMonth.getMonth()).trigger('click');

来源

2013-01-07 18:16:32 MFix

这个想法是在页面加载的任何月份显示正确的内容，因此用户不必选择当前月份，但仍可以在几个月之间来回切换。 – asherrard

我的意思是添加“活动”类只会影响标签的外观。它不会激活正确的'.tab-pane'元素。这就是为什么我建议触发点击事件。 – MFix

Twitter Bootstrap有一个适当的API：'.tab（'show'）' – Sherbrow

是否存在所有月份的javascript switch语句片段

回答

相关问题