添加陣列名字符串和更新 - 的JavaScript

Question

我試圖創建一個函數，將繼續選定的顏色標識添加到我的#storage_disply格式爲：

var name_of_array = ["#xxxxxx", "#xxxxxx", etc]

<script type="text/javascript" src="jquery-1.6.2.js"></script> 
<script type="text/javascript"> 

$(document).ready(function() { 



var selected_color = []; 
var ids = []; 
var black_colors = []; 
var blue_colors = []; 
var brown_colors = []; 
var gray_colors = []; 
var green_colors = []; 
var orange_colors = []; 
var pink_colors = []; 
var purple_colors = []; 
var red_colors = []; 
var teal_colors = []; 
var white_colors = []; 
var yellow_colors = []; 

    $(".color_cell").click(function(){ 
     // ADD MY COLOR TO SELECTED COLOR'S ARRAY  
     selected_color.push($(this).attr("id")); 
     console.log($(this).attr("id")); 
     $(this).css({'background-color':'white'}); 
     $(this).unbind('click'); 
     updateDisplay(selected_color); 
    }); 



    $(".btnColor").click(function(){ 
     // MAKE SELECTED COLOR BE ME 
     if ($(this).attr("id") == "black") { 
      selected_color = black_colors; 
     } 
     else if ($(this).attr("id") == "blue") { 
      selected_color = blue_colors; 
     } 
     else if ($(this).attr("id") == "brown") { 
      selected_color = brown_colors; 
     } 
     else if ($(this).attr("id") == "gray") { 
      selected_color = gray_colors; 
     } 
     else if ($(this).attr("id") == "green") { 
      selected_color = green_colors; 
     }  
     else if ($(this).attr("id") == "orange") { 
      selected_color = orange_colors; 
     } 
     else if ($(this).attr("id") == "pink") { 
      selected_color = pink_colors; 
     } 
     else if ($(this).attr("id") == "purple") { 
      selected_color = purple_colors; 
     } 
     else if ($(this).attr("id") == "red") { 
      selected_color = red_colors; 
     } 
     else if ($(this).attr("id") == "teal") { 
      selected_color = teal_colors; 
     } 
     else if ($(this).attr("id") == "white") { 
      selected_color = white_colors; 
     } 
     else if ($(this).attr("id") == "yellow") { 
      selected_color = yellow_colors; 
     } 
     }); // end button handler 
    }); // end ready() 

function updateDisplay(colors) { 

     jQuery.each(colors, function(key, value) { 


     //var test_colors = ["#000000", "#FFFFFF"]; 
     //display var 
     $("#storage_display").html("var "+$("#storage_display").html()+" " +value); 

    }); 

} 

</script> 
<br> 
<br> 
    <button type="button" class="btnColor" id="black">Black</button>&nbsp; 
    <button type="button" class="btnColor" id="blue">Blue</button>&nbsp; 
    <button type="button" class="btnColor" id="brown">Brown</button>&nbsp; 
    <button type="button" class="btnColor" id="gray">Gray</button>&nbsp; 
    <button type="button" class="btnColor" id="green">Green</button>&nbsp; 
    <button type="button" class="btnColor" id="orange">Orange</button>&nbsp; 
    <button type="button" class="btnColor" id="pink">Pink</button>&nbsp; 
    <button type="button" class="btnColor" id="purple">Purple</button>&nbsp; 
    <button type="button" class="btnColor" id="red">Red</button>&nbsp; 
    <button type="button" class="btnColor" id="teal">Teal</button>&nbsp; 
    <button type="button" class="btnColor" id="white">White</button>&nbsp; 
    <button type="button" class="btnColor" id="yellow">Yellow</button>&nbsp; 

截至目前它顯示：var var var var var var 6010b0 6010b0 9010b0 6010b0 9010b0 f010b0

我真的很新，我不明白如何獲取數組名稱到字符串中。

在此先感謝！

Answer 1

無需循環。剛剛加入數組，並添加一些額外的字符串，在需要的地方：

function updateDisplay(colors) { 
    var allColors = "\"#" + colors.join("\", \"#") + "\""; 
    $("#storage_display").html("var name_of_array = [" + allColors + "]"); 
} 

編輯：自定義數組名，傳遞到this.idupdateDisplay()：

$(".color_cell").one("click", function() { 
    selected_color.push(this.id); 
    $(this).css({'background-color':'white'}); 
    updateDisplay(selected_color, this.id); 
}); 

function updateDisplay(colors, name) { 
    var allColors = "\"#" + colors.join("\", \"#") + "\""; 
    $("#storage_display").html("var " + name + "_colors = [" + allColors + "]"); 
} 

Answer 2

試試這個：

function updateDisplay(colors) { 
    $("#storage_display").text("var name_of_array = [" + colors.join(", ") +"]"); 
} 

join會加入你的陣列通過你傳遞給它的參數一起分離出來的元素。無需自行循環。