-1

我正在使用 jQuery 创建颜色选择器的 codecademy.com 课程，用户可以使用它来选择 div 的背景和边框颜色。你可以在这里看到它应该是什么样子（在练习 4-3 中）。 http://www.codecademy.com/courses/basic-jquery/3#!/exercises/2 基本上有一排彩色框，您可以单击以选择主 div 的不同属性的颜色。总共有三行（每行有很多彩色框）来选择我们可以设置样式的 div 的三个属性的颜色。

我的问题涉及 makeColorOption 函数。它为颜色参数添加了一个类“colorOption”，但是，我从来没有看到这个函数调用了一个颜色传递给它。我假设必须为数组中的每种颜色调用一次，但我看不到任何地方发生这种情况。

谁能解释我是否遗漏了什么？

        $('document').ready(function(){

   //make the color pickers
   var colors = ['red','green','blue','yellow','black','white'];

   function makeColorOption(color) {
       return $('<div/>')
                    .addClass("colorOption")
                    .html(color)
                    .css('background-color',color);
   }

   $.each(colors,function(i,v) {
       $('div.colorPicker').append(
           $('<div/>')
                    .addClass("colorOption")
                    .html(v)
                    .css('background-color',v)
        );
   });

    $('div.colorPicker').append($('<div/>').addClass('clearfix'));


    $('div.colorOption').click(function(){

        var $this = $(this);

        var target = $this.closest('div.colorPicker').data('styleTarget');
        switch(target) {
            case 'background-color':
                setBackgroundColor($('#toy'),$this.html());
                break;
            case 'text-color':
                setTextColor($('#toy'),$this.html());
                break;
            case 'border-color':
                setBorderColor($('#toy'),$this.html());
                break;
            default:
                alert('hi');
        }

    });

});
4

1 回答 1

0

你没有遗漏任何东西，这个makeColorOption功能没有被使用。颜色选择器是由$.each(colors,function(i,v)循环创建的，它的主体复制了什么makeColorOption。

您可以将该循环更改为：

   $.each(colors,function(i,v) {
       $('div.colorPicker').append(makeColorOption(v));
   });

这将是等效的。

于 2012-09-05T23:49:29.407 回答