2012-08-06 60 views
0

我有一個只能使用一次的函數。我敢肯定這是因爲它說「返回」,我沒有任何循環,等等任何人都可以幫我解開這個功能? (這一切都在jQuery容器中,儘管我不認爲jQuery可能與這個問題有很大關係。)從多次使用的函數返回不同的值

從Farbtastic返回的HSL顏色格式爲(色調,飽和度,亮度)。我正在調整第三個值,輕量級,並且這部分工作。所有的重複都不起作用。它使所有新色板成爲第一塊色板的顏色。

function onColorChange(color) { 

     // retrieve HSL color value 
     var hslcolor = $.farbtastic('#main_color_picker').hsl; 

     // create 4 new colors of varying brightness, and variable names to save them to db. 
       var newcolor1 = hslcolor; 
       var newcolor2 = hslcolor; 
       var newcolor3 = hslcolor; 
       var newcolor4 = hslcolor; 
        newcolor1[2] = 0.10 * (Math.round(hslcolor[2]*10000)/10000); 
        newcolor2[2] = 0.85 * (Math.round(hslcolor[2]*10000)/10000); 
        newcolor3[2] = 1.15 * (Math.round(hslcolor[2]*10000)/10000); 
        newcolor4[2] = 1.50 * (Math.round(hslcolor[2]*10000)/10000); 
       var rgb1 = hsl2rgb(newcolor1); 
       var rgb2 = hsl2rgb(newcolor2); 
       var rgb3 = hsl2rgb(newcolor3); 
       var rgb4 = hsl2rgb(newcolor4); 

     //apply the color to swatches and show original swatch in the middle. 
     var firstSwatch = $('#section-main_color').find('.square1'); 
     firstSwatch.css('background-color', 'rgb('+rgb1.r+','+rgb1.g+','+rgb1.b+')'); 
     var secondSwatch = $('#section-main_color').find('.square2'); 
     secondSwatch.css('background-color', 'rgb('+rgb2.r+','+rgb2.g+','+rgb2.b+')'); 
        // original color is in square 3 
     var fourthSwatch = $('#section-main_color').find('.square4'); 
     fourthSwatch.css('background-color', 'rgb('+rgb3.r+','+rgb3.g+','+rgb3.b+')'); 
     var fifthSwatch = $('#section-main_color').find('.square5'); 
     fifthSwatch.css('background-color', 'rgb('+rgb4.r+','+rgb4.g+','+rgb4.b+')'); 

    } 

function hsl2rgb(hsl) { 
    var h = hsl[0], s = hsl[1], l = hsl[2]; 
    var m1, m2, hue; 
    var r, g, b 
    h = (Math.round(360*h)/1); 
    if (s == 0) 
     r = g = b = (l * 255); 
    else { 
     if (l <= 0.5) 
      m2 = l * (s + 1); 
     else 
      m2 = l + s - l * s; 
     m1 = l * 2 - m2; 
     hue = h/360; 
     r = Math.round(HueToRgb(m1, m2, hue + 1/3)); 
     g = Math.round(HueToRgb(m1, m2, hue)); 
     b = Math.round(HueToRgb(m1, m2, hue - 1/3)); 
    } 
    return {r: r, g: g, b: b}; 
} 

對於這個問題的第一部分,關於主題選項面板中使用Farbtastic HSL,請參閱:Farbtastic convert HSL back to RGB or Hex

跟帖: 如果你需要一個數組的實際拷貝,我發現這bit:

 var newcolor = hslcolor.slice(0); 

在大多數情況下避免使用這可能是一個好主意。我發現我需要保留原來的陣列,用於另一組計算,所以我在副本上做了我的亮度。

+1

您可以嘗試重現http://jsfiddle.net/中的錯誤嗎? – NicoSantangelo 2012-08-06 00:25:13

+0

這與使用'return'或不使用循環無關。大多數函數爲不同的輸入返回不同的值,我相信這個函數也可以。該錯誤必須在其他地方。正如已經說過的,請創建一個jsfiddle演示,它會幫助我們幫助你。 – 2012-08-06 00:33:27

+0

不工作:http://jsfiddle.net/uttqX/5/ 這裏是工作的例子,但只有我只做一種顏色:http://jsfiddle.net/MdN7X/ – 2012-08-06 00:59:06

回答

0

這是你在找什麼:http://jsfiddle.net/uttqX/6/ 爲什麼沒有工作的原因,是因爲你多次更新相同的變量再次,因爲您分配的所有變量在乞討相同的初始變量。因此,對這些變量中的任何一個的任何更新都會傳播到初始變量(hslcolor),然後返回到所有其他變量。

+1

更好的解釋是,一個作業像'newcolor1 = hslcolor'不會創建數組的新副本。這兩個變量都指向同一個數組,因此一個元素[2]的改變會影響另一個。請參閱http://my.opera.com/GreyWyvern/blog/show.dml/1725165。 – Barmar 2012-08-06 02:25:09

+0

同意來自Barmar的評論。正試圖找出如何在短段內更好地解釋ByRef與ByVal,但失敗。 – 2012-08-06 02:26:57

+0

我看到它正在工作,而且我也認爲我理解了解釋,但是......您在代碼中更改了哪些內容以使其有效?它看起來和我完全一樣。 – 2012-08-06 02:58:07