使用日期ID追加多個div

我正在嘗試創建一種生命週期，我將在其中顯示推文等。無論如何，我剛剛開始，而且我被困在一些非常容易的事情上，但我無法弄清楚。使用日期ID追加多個div

我試圖追加到一個容器一系列divs（30是確切的）的方式，每個div有一個類/ ID與它所關心的日期。我已經有一個包含當前日期的日期變量，格式爲dd-mm-yyyy。我想附加到我的容器，如：

<div class="entry" id="12-05-2011"> 
</div> 
<div class="entry" id="11-05-2011"> 
</div> 
<div class="entry" id="10-05-2011"> 
</div> 
etc...

第一個是在當前日期約會。

你有什麼想法如何做到這一點？

在此先感謝！

這裏是我的日期代碼：

var time = new Date(); 
var day = time.getDate(); 
var month = time.getMonth() + 1; 
if(month < 10){ 
month = "0" + month; 
} 
var year = time.getFullYear(); 
var date = day + "-" + month + "-" + year;

來源

2011-05-12 Charleshaa

沒有答案從我;但一個快速的評論。你每天只有一個帖子的可能性有多大？如果你每天有超過一個，那麼你最終會得到非唯一的ID，它會混淆你寫的任何JavaScript。 – Dave

該div將包含當天的多個帖子。 :) – Charleshaa

1分鐘，使小提琴 – Neal

下面是一些JS，你可以這樣做：

date_counter = { 
    current_day: (new Date()).getDate(), 
    current_month: (new Date()).getMonth(), 
    current_year: (new Date()).getFullYear(), 
    get_date: function(days_past){ 
     var time = new Date(this.current_year, 
          this.current_month, 
          (this.current_day)+days_past); 
     var day = time.getDate(); 
     var month = time.getMonth() + 1; 
     if (month < 10) { 
      month = "0" + month; 
     } 
     var year = time.getFullYear(); 
     var date = day + "-" + month + "-" + year; 
     return date 
    } 
} 

for (var i = 0; i <= 30; i++) 
{ 
    console.log(date_counter.get_date(i)); 
    var date = date_counter.get_date(i); 
    $the_div = $('<div>', { 
     id: 'date_' + date, //to have correct types of ids (see comments below) 
     text: 'Content for ' + date 
    }); 
    $the_div.appendTo(document.body); 
}

這裏是小提琴例如：http://jsfiddle.net/maniator/zrnnP/

來源

2011-05-12 15:24:10 Neal

哇！我其實需要一天的順序，但我會盡力自己做出改變並回復你！我很新的JavaScript和說實話，我知道這是壞的，但我直接開始與jQuery，所以我仍然有點丟失，當涉及到純粹的JavaScript hehe ... – Charleshaa

nooo問題： - D記得選擇一個'當你可以：-D – Neal

Arf，我試圖修改代碼以符合我的目標，但無法讓它工作...你介意修改它，以便它符合我的問題：順序天從實際日期開始的降序？我會很感激:) – Charleshaa

不知道爲什麼奧尼爾的回答是如此複雜。也許我失去了一些東西，但以下似乎爲我工作...

var date = new Date() 
date.setMonth(date.getMonth() - 1); 

while(date <= new Date()) { 
    $('#container').append(getDateDiv(date)); 
    date.setDate(date.getDate() + 1); 
} 

function getDateDiv(date) { 
    return '<div id="' + getDateString(date) + '"></div>'; 
} 

function getDateString(date) { 
    // note that months are 0 indexed 
    return date.getDate() + '-' 
     + (date.getMonth() + 1) 
     + '-' + date.getFullYear(); 
}

剛看到你想按降序排列編輯，所以......

var date = new Date() 
var counter = 0; 
while(counter <= 30) 
{ 
    $('#container').append(getDateDiv(date)); 
    date.setDate(date.getDate() - 1); 
    counter++; 
}

順便說一句，我建議使用yyyymmdd格式的日期來代替。

來源

2011-05-12 15:54:26 fearofawhackplanet

非常感謝，似乎更容易！但有了這個解決方案，我們在一個循環中追加權？瀏覽器不是很難嗎？ – Charleshaa

不是真的，除非你想展示過去幾十年的歷史:)。您可以將$（'＃container'）'jQuery選擇器提升到循環外的變量中，以便在困擾您時提高性能。 – fearofawhackplanet

@fearodwhack，我改變了我的回答 – Neal

使用日期ID追加多個div

回答

相關問題