Question

这是一个非常简单的问题。一个基本的开始在Twitter bootstrap和CSS。我正在尝试通过计算当前月份和列表中的3个月来将数据添加到下拉菜单中以选择表单。

    <ul class="dropdown-menu">
        <li><a href="#">Month 1</a></li>            
        <li><a href="#">Month 2</a></li>
        <li><a href="#">Month 3</a></li>
        <li><a href="#">Month 4</a></li>
    </ul>



  var d=new Date();
  var month=new Array();
  month[d.getMonth()+1];
  month[d.getMonth()+2];
  month[d.getMonth()+3];

如何将这些值加载到下拉菜单中？

修改

    <!DOCTYPE html>

    <html lang="en">
    <head>
    <style type="text/css">


    #dd1{
       margin-left:auto;
   margin-right:auto;
   width:70%;
}


</style>
<title>Drop Down Navbar</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">  </script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript">

var items = $("#dd2");
var d=new Date();
var month=new Array();
month[d.getMonth()];
month[d.getMonth()+1];
month[d.getMonth()+2];
month[d.getMonth()+3];
for(i=0; i<month.length; i++)
   $(items[i]).html(month[i]);


</script>
    </head>
    <body>

<div class="container">
    <div class="row">
        <div class="span12">

            <h3>Google App Analytics</h3>


                    <ul class="nav nav-tabs">
                         <li><a href="#home" data-toggle="tab">Monthly Analysis</a></li>
                         <li><a href="#profile" data-toggle="tab">Compare Months</a></li>
                    </ul>
                    <li id='dd1' class="dropdown">
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                Choose Month <b class="caret"></b>
                            </a>

                            <ul id='dd2' class="dropdown-menu">

                            </ul>

                        </li>

        </div>
    </div>
</div>

Answer 1

你需要将jquery包装在这样的函数中。

$(document).ready(function(){ // Code goes here. });

此外，您还需要像这样分配数组。

var month = new Array();
month[0] = "someValue";

尝试下面的代码也是jsfiddle example

<!DOCTYPE html>
<html lang="en">
<head>
<style type="text/css">
 #dd1
 {
  margin-left:auto;
  margin-right:auto;
  width:70%;
 }
 </style>
<title>Drop Down Navbar</title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">  </script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var d=new Date();

var month=new Array();
month[0] = [d.getMonth()];
month[1] = [d.getMonth()+1];
month[2] = [d.getMonth()+2];
month[3] = [d.getMonth()+3];

for(i=0; i<month.length; i++)
   $("#dd2").append("<li><a href=''>"+month[i]+"</a></li>");
});
</script>
</head>
<body>
<div class="container">
  <div class="row">
    <div class="span12">
       <h3>Google App Analytics</h3>
           <ul class="nav nav-tabs">
              <li><a href="#home" data-toggle="tab">Monthly Analysis</a></li>
              <li><a href="#profile" data-toggle="tab">Compare Months</a></li>
              <li id='dd1' class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Choose Month <b class="caret"></b></a>
                <ul id='dd2' class="dropdown-menu"></ul>
             </li>
           </ul>
        </div>
    </div>
</div>

Answer 2

你做错的基础是创建数组。你应该给一个索引和值创建一个有效的javascript数组，所以像这样：

month[0] = curMonth;
month[1] = curMonth+1;
month[2] = curMonth+3;
month[3] = curMonth+2;

我确实存储了当月，因此您无需一遍又一遍地调用Date对象：

var curMonth = d.getMonth();。

你可以通过循环使这更加动态：

for(i=0; i< 4; i++)
{
    month[i] = curMonth+i;
}

所以现在你有一个包含4个值的数组。您希望在标识为<ul>的某个#dd2中使用此功能。我不确定为什么你为元素添加了一个索引值，但你可以只调用id元素。 ID首先是唯一的，因此不应该有任何其他具有此ID的元素。。
现在出了问题的是你用.html()覆盖了所放置的内容，你实际上想要在每次迭代时扩展它。您可以使用.append()：

for(i=0; i<month.length; i++)
{
   $("#dd2").append('<li>' + month[i] + '</li>');
}

<强> jsFiddle

我希望这就是你的意思。

下拉菜单TBS - 加载值

修改

2 个答案: