Question

我是Javascript和jQuery的新手，并且无法调整以下脚本：

如上所述，它从颜色值数组中找到最接近的颜色。

我如何编辑代码，而不是评估此数组中的颜色值：

var base_colors=["660000","0066cc","ff9900"];

它将评估JSON数组中的hexvalue属性，如下所示：

var base_colors = [
    { "name" : "burgundy" , "number" : "17A" , "hexvalue" : "660000"}, 
    { "name" : "blue" , "number" : "18B ", "hexvalue" : "0066cc"}, 
    { "name" : "orange" , "number" : "19C" , "hexvalue" : "ff9900"}];

最后，我如何使用jQuery引用包含base_colors数组的外部JSON文件？

Answer 1

我已经对你的jsFiddle做了改变，应该做到这一点。

http://jsfiddle.net/kJdX3/9/

function getSimilarColors (color) {
    var base_colors = [
{ "name" : "burgundy" , "number" : "17A" , "hexvalue" : "660000"}, 
{ "name" : "blue" , "number" : "18B ", "hexvalue" : "0066cc"}, 
{ "name" : "orange" , "number" : "19C" , "hexvalue" : "ff9900"}];
    //Convert to RGB, then R, G, B
    var color_rgb = hex2rgb(color);
    var color_r = color_rgb.split(',')[0];
    var color_g = color_rgb.split(',')[1];
    var color_b = color_rgb.split(',')[2];

    //Create an emtyp array for the difference betwwen the colors
    var differenceArray=[];

    //Function to find the smallest value in an array
    Array.min = function( array ){
           return Math.min.apply( Math, array );
    };


    //Convert the HEX color in the array to RGB colors, split them up to R-G-B, then find out the difference between the "color" and the colors in the array
    $.each(base_colors, function(index, value) { 
        var base_color_rgb = hex2rgb(value.hexvalue);
        var base_colors_r = base_color_rgb.split(',')[0];
        var base_colors_g = base_color_rgb.split(',')[1];
        var base_colors_b = base_color_rgb.split(',')[2];

        //Add the difference to the differenceArray
        differenceArray.push(Math.sqrt((color_r-base_colors_r)*(color_r-base_colors_r)+(color_g-base_colors_g)*(color_g-base_colors_g)+(color_b-base_colors_b)*(color_b-base_colors_b)));
    });

    //Get the lowest number from the differenceArray
    var lowest = Array.min(differenceArray);

    //Get the index for that lowest number
    var index = differenceArray.indexOf(lowest);

    //Function to convert HEX to RGB
    function hex2rgb( colour ) {
        var r,g,b;
        if ( colour.charAt(0) == '#' ) {
            colour = colour.substr(1);
        }

        r = colour.charAt(0) + colour.charAt(1);
        g = colour.charAt(2) + colour.charAt(3);
        b = colour.charAt(4) + colour.charAt(5);

        r = parseInt( r,16 );
        g = parseInt( g,16 );
        b = parseInt( b ,16);
        return r+','+g+','+b;
    }

    //Return the HEX code
    return base_colors[index].hexvalue;
}

以下是我改变的内容：

var base_color_rgb = hex2rgb(value.hexvalue);

return base_colors[index].hexvalue;

Answer 2

使用http://api.jquery.com/jQuery.getJSON/

$.getJSON(url, params, function(data) {
 // your json with colors
});

非常重要： json应该有效！

jQuery从JSON数组中找到类似的颜色

2 个答案: