javascript：列表中包含n個循環元素後的div

我有一個由for循環的javascript生成的元素的長列表。最初我只有4-5個元素，事情都很好，但現在我有超過30個元素使列表很長。我打算在一個span或div中附上5個元素，這樣我可以將它左移並將列表堆疊爲列，但由於結束標記，我無法使其工作。javascript：列表中包含n個循環元素後的div

var ttllist=""; 
for(i=0;i<x.length;i++) 
{ 
    if(i%5==0) 
    { 
    ttllst +='<span style="float:left">'; 
    } 
    ttllst += x[i]+'<br/>'; 
//How to close the span tags accurately ??? 
} 
return ttllist;

我現在面臨的問題是x.length可以是任何數字，因此我留下了未封閉的標籤一段時間。有人可以請幫忙嗎？

來源

2014-01-17 jahajee.com

你能爲創造小提琴....這裏是鏈接http://jsfiddle.net/ –

你可能已經在這裏一個錯字 - 'ttllist' VS'ttllst'。 – Erlik

如果索引大於5，則可以在開始新標記之前關閉span標記。還應該在退出循環時關閉標記。

var ttllst=""; 
for(i=0;i<x.length;i++) 
{ 
    if(i%5==0) 
    { 
    if(i>0) { 
     ttllst += '</span>'; 
    } 
    ttllst +='<span style="float:left">'; 
    } 
    ttllst += x[i]+'<br/>'; 
} 
if (x.length > 0) { 
    ttllst += '</span>'; 
} 
return ttllst;

這是你可能需要進一步的邏輯，以涵蓋其他不測事件一個基本的例子，但希望這有助於。

來源

2014-01-17 11:36:03

這不會結束第一個「span」。 'i> 5'條件是錯誤的。 – Erlik

是的，你是對的，編輯我> 0;應該正確工作 –

謝謝，爲了簡單接受它。你還編輯了答案，使其正確。 –

這應該工作。我已經提出了一些意見來解釋邏輯。

var ttllist=""; 
for(i=0; i<x.length; i++) { 
    if(i%5 == 0) { 
     // if first item, don't close span 
     if(i > 0) ttllst += '</span>'; 
     // if more to come, open new span 
     if(i < x.length - 1) ttllst +='<span style="float:left">'; 
    } 
    ttllst += x[i] + '<br/>'; 
    // if no more items to come, close last opened span 
    if(i == x.length - 1) ttllst += '</span>'; 
} 
return ttllist;

來源

2014-01-17 11:42:03 techfoobar

// function to render one block 
function renderBlock(block) { 
    var out = ''; 
    out += '<span style="float:left">'; 
    for(var j in block) 
    out += block[j] + "<br/>"; 
    out += '</span>';  
    return out; 
}  

var blocks = [], // array to store blocks 
    size = 5;  // items in one block 

// split array into blocks 
while (x.length > 0) 
    blocks.push(x.splice(0, size)); 

// render output 
var ttllist = ''; 
for(var i in blocks) 
    ttllist += renderBlock(blocks[i]); 
return ttlist;

來源

2014-01-17 11:42:31 zavg

javascript：列表中包含n個循環元素後的div

回答

相關問題