如果聲明裏面的javascript變量

-1

一些背景：我有一個JavaScript AJAX函數，它獲取xml輸出。響應被髮送到另一個生成正確HTML的javascript函數。我循環訪問xml文件以獲取內容並構建代碼。輸出應該是每行最多4個div的行，其中每個div都包含循環的特定輸出。如果聲明裏面的javascript變量

問題：我想檢查行中放置了多少個div，以決定是否啓動新行。我創建了一個變量塊，用於計算當前存在的div的數量，在每個div被放置後它會隨着1增加。如果blocks = 4，意味着4行被放置在該行，並且var塊被設置爲0.我想在JavaScript變量內部執行此操作，以便我可以執行客戶端的所有操作。完成後，我想通過innerHTML將變量放入HTML元素中。

的Javascript至今（將成爲環的一部分）：

var blocks=0; 
var output= 
     if(blocks==0) 
     { 
      '<div id="row"><div id="bl1">block1</div>'; 
      blocks+=1; 
     } 

    else if (blocks==1) 
    { 
     '<div id="bl2">block2</div>'; 
     blocks+=1; 
    } 

    else if(blocks==2) 
    { 
     '<div id="bl3">block3</div>'; 
     blocks+=1; 
    } 

    else if(blocks==3) 
    { 
     '<div id="bl4">block4</div></div>'; 
     blocks=0; 
    }

完成後，我想將另一分區內輸出變量：

document.getElementById("output-div").innerHTML=output;

不幸的是這並沒有顯示任何結果。

有什麼想法？

來源

2016-09-28 ILE

那麼你面臨的問題是什麼？ – Ted

問題是我的代碼沒有給出任何結果，所以我想知道如果任何人有任何想法如何解決/處理這個？如果xml中有16個項目，則輸出應爲4行，每行4個塊（div）（每個塊是行div的子div）。這個HTML必須在/附加到我可以用innerHTML顯示的輸出變量中創建。 – ILE

以上答案啓發了我，我想出了這個解決方案。基本上我跟蹤附加到一行的塊的數量。如果附加了4個塊，則意味着必須首先創建一個新行。

<div id="output"></div> 

<script type="text/javascript"> 
var list=['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']; 
var index, len; 
var row_number=0; // keep track of the row number we're appending blocks to 
var block=0; // keep track of amount of blocks created in row_number 

for (index = 0, len = list.length; index < len; ++index) { 

    if(block==0) // if block=0 then a new row needs to be created 
    { 
     //create new row and append to output 
     var div_row=document.createElement("div"); 
     div_row.className="logo-row"; // assign className for css purposes 
     ++row_number; 
     div_row.id="model_row_"+row_number; //assign id for append block purposes 
     document.getElementById("output").appendChild(div_row); 

     // create new (first) block and append to row 
     var div_model=document.createElement("div"); 
     div_model.className='logo-block'+(block+1); // assign className for css purposes. Eack block could get different styling 
     div_model.innerHTML=(list[index]); 
     document.getElementById("model_row_"+row_number).appendChild(div_model); 
     ++block; 
    } 

    else if (block==1 | block==2) // a second and third block can be created 
    { 
     var div_model=document.createElement("div"); 
     div_model.className='logo-block'+(block+1); 
     div_model.innerHTML=(list[index]); 
     document.getElementById("model_row_"+row_number).appendChild(div_model); 
     ++block; 
    } 

    else // a fourth block can be created, after which a new row must be created to set block to 0 
    { 
     var div_model=document.createElement("div"); 
     div_model.className='logo-block'+(block+1); 
     div_model.innerHTML=(list[index]); 
     document.getElementById("model_row_"+row_number).appendChild(div_model); 
     block=0; 
    } 
}; 

</script>

感謝所有花時間回答和您的建議！

來源

2016-09-28 16:16:38 ILE

如果聲明裏面的javascript變量

回答

相關問題