2013-07-12 79 views
0

我有一個輸出十六進制值的顏色更改工具。我所需要的是將最終形式的價值改爲顏色名稱。有幾個輸出需要更改,顏色名稱列表有1,512個條目。所以,例如,我的一個輸出是cp-swbluesbbg-output,並且說它返回值#006a66,那麼它應該被轉換爲「Poseiden」。用Javascript更改輸出值

輸出字符串爲:

function(event, color) { 
$('.cp-swbluesbbg-output').text(color.formatted); 
    /*returns the value i need to convert. i.e. #006a66*/ 

我的變量被設置如下(固定在簡單的格式與1512個條目總數):

var newName = { 
    "#006A66" : "Poseidon SW6762", 
    "#006A84" : "Blue Nile SW6776", 
    "#006B55" : "Starboard SW6755", 
    "#006E7F" : "Maxi Teal SW6769"} ] /*this list is 1,512 entries long*/ 

我試過的多次迭代正常的字符串搜索,但似乎沒有工作。 我對此很新,並且遇到困難的時間進行搜索,將根據每種顏色的輸出返回顏色名稱。任何幫助將非常感激。

+1

如果您執行'console.log(newName [「#006A66」])'somewhere?會發生什麼?這可能與將十六進制代碼作爲密鑰傳入並將文本設置爲與該密鑰關聯的值一樣簡單。 –

+0

您可以更改顏色對象的格式嗎?它有很多微小的陣列使得這個過程更長。假設顏色值是唯一的,你應該可以像這樣格式化:var newName = {「#006A66」:「Poseidon SW6762」,「#006A84」:「Blue Nile SW6776」, 「#006B55」: 「Starboard SW6755」,「#006E7F」:「Maxi Teal SW6769」},這將使您的搜索變得更加簡單。 – talemyn

+0

@talemyn - 我可以很容易地改變'newName'的格式,所以這不會是一個大問題,除非它是如此之大。你有一個好的方法來從字符串中獲得我需要的價值的建議嗎? –

回答

0

newName看起來像一個JSON數組..因爲你正在使用jQuery你可以使用$.parseJSON()然後在您的功能得到了顏色,你可以用newName[color]找到顏色的名稱,其中color是十六進制代碼的參數。

0

使用您當前的設置,獲得您的價值的最快捷方式是循環瀏覽整個對象,直到找到想要的值然後突然出現爲止。事情是這樣的:

for (var currentColorPair in newName) { 
    if (newName.hasOwnProperty(currentColorPair)) { 
     if (newName[currentColorPair][hexValue]) { 
      return newName[currentColorPair][hexValue]; 
     } 
    } 
} 

return "Color does not exist"; 

但是,如果你能更新「了newName」的結構是一個比較簡單的數組,像這樣:

var newName = { 
    "#006A66" : "Poseidon SW6762", 
    "#006A84" : "Blue Nile SW6776", 
    "#006B55" : "Starboard SW6755", 
    "#006E7F" : "Maxi Teal SW6769"}; 

然後,你可以簡單地這樣稱呼它:

if (newName[hexValue]) { 
    return newName[hexValue]; 
} 
else { 
    return "Color does not exist"; 
} 

。 。 。或者,更簡單地說,像這樣:

return (newName[hexValue]) ? newName[hexValue] : "Color does not exist"; 
+0

這看起來很直截了當,但我無法使它工作。我重新設置了'newName''' var'的結構,並將'hexValue'的'var'設置爲'document.getElementsByClassName(「cp-bluesbbg-output」).value;'但它不返回任何東西。 –

+0

我注意到你的示例代碼中有'#006a66'被列爲正在返回的值,而數組中的值是'#006A66'。這個例子在查找值時很重要,因爲所有的數組數據看起來都是大寫的,所以嘗試將代碼更新爲'document.getElementsByClassName(「cp-bluesbbg-output」)。value.toUpperCase(); '看看是否有幫助。 – talemyn