0

それは非常に簡単な質問です。基本は Twitter ブートストラップと 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>
4

2 に答える 2

1

このような関数で jquery をラップする必要があります。

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

また、そのように配列を割り当てる必要があります。

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

以下のコードを試してください。jsfiddle の例もここにあります

<!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>
于 2013-10-28T20:54:55.533 に答える