jQuery刪除重複的代碼 - 更簡單的解決方案？

我正在處理somethign，我有兩個輸入字段，一個用於主要顏色，另一個用於輔助顏色。我正在使用JSColor因此，當您單擊輸入框時會出現顏色選擇器，並且當您更改顏色時，輸入的背景會更改爲該顏色。jQuery刪除重複的代碼 - 更簡單的解決方案？

嗯，我想有另一個特點，我可以有一些「預製」的色彩，有人可以選擇的形式。所以這裏是我有：

<a id="standardTheme">Standard Theme</a> 
<a id="themeTwo">Theme Two</a>

等等。而我的jQuery是：

$('#standardTheme').click(function() { 
    var primaryPicker = new jscolor.color(document.getElementById('primaryColor'), {}) 
     primaryPicker.fromString('FF0000') 

    var secondaryPicker = new jscolor.color(document.getElementById('secondaryColor'), {}) 
     secondaryPicker.fromString('000000') 
});

這是完美的。那麼對於themeTwo我將不得不復制整個代碼，並手動輸入我想要的主題二新的十六進制顏色。

我可能有5或6個主題可供選擇，這樣可能會變得很長。我想知道是否有人可以幫助我改進代碼，如果有更簡單的方法可以做到這一點，更短，更靈活的時候，我想添加更多的主題？

謝謝！

來源

2011-12-13 Drew

爲什麼不簡單地將數據與您點擊的按鈕關聯？

<button class="themeButton" data-primary-color="FF0000" data-secondary-color="000000">Standard</button>

然後在jQuery的：

$('.themeButton').click(function() 
{ 
    var primaryColor = $(this).data('primary-color'); 
    var secondaryColor = $(this).data('secondary-color'); 

    // OR the more verbose way 

    var primaryColor = $(this).attr('data-primary-color'); 
    var secondaryColor = $(this).attr('data-secondary-color'); 

    // Do your code with the primary and secondary color text 
});

，因爲你需要放置你需要，只要你適當地對每個按鈕設置的屬性然而，許多按鈕，然後就可以延長許多倍。然後，您可以在所有按鈕之間共享回調。

來源

2011-12-13 19:31:17 Tejs

哇！這將工作完美。我一直忘記我可以將自定義數據放在我的元素上。謝謝：） – Drew 2011-12-13 19:36:50

jQuery刪除重複的代碼 - 更簡單的解決方案？

回答

相關問題