不确定为什么jQuery没有获取变量信息

Question

The values don't seem to be coming out and showing up on the page. It should be creating divs that pop up with the google_color and the background set to the hex value.

The app is suppose to take pixel image data and match it to my swatch library known as formatted_colors.js, which is an array. The array looks like this:

var colors = []; colors["000000"] = "black"; colors["100000"] = "black"; colors["200000"] = "black";

Maybe I'm not suppose to use the .each function? Although it is a loop.

Here is a snippet:

<div class="rounded_color" hex="<?php echo $css_color ?>" xy="<?php echo $x.$y ?>"></div>
<div id="<?php echo $x.$y ?>"></div>

<script type="text/javascript" src="jquery-1.6.2.js"></script>
<script src="formatted_colors.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">

//iterate through pixels and match rounded color to array in formatted_colors.js

$(document).ready(function() {

    $(".rounded_color").each(function(){ 
            var google_color = getColor($(this).attr("hex")); // finds a match of "hex" value in formatted_colors.js and return name to google_color
            $('#'+$(this).attr("hex")).html(google_color); // set the div's html to name which is google_color
            alert('#'+$(this).attr("id")); //testing if value is there, but shows #undefined
            $('#'+$(this).attr("hex")).css('background-color:', google_color); 
    })


// get name of color function from formatted_colors.js

function getColor(target_color){
    if (colors[target_color] == undefined) { // not found
      return "no match";
    } else {
      return colors[target_color];
    }
  } // end getColor function


}) // end ready function

</script>

Sorry, I'm new to this so I'm not sure what to do exactly now.

Here is my entire code: http://pastebin.com/HEB3TWZP

Thanks in advance!

Answer 1

You don't need to concatenate #. this is the current element in the iteration.

Also you might want to do something like var $this = $(this); Cleans up your code and you aren't recreating the jQuery object over and over again within the same iteration.