更新顏色選擇器面板中的新顏色

Question

我安裝了一個jQuery插件顏色選擇器：colpick.js，我不知道如何 設置顏色調色板中的圓形圖標的新顏色（刷新頁面後元素的bg被更改。但在調板中的圓形圖標仍然是默認的顏色區域color:'003a7d。它並沒有更新）（然而，拾色器和餅乾都運作良好）

這是我的代碼： HTML：

<div id="picker"></div>

JS：

if($.cookie('body_color')) { 
     $('body,.livebgchanger ul li a').css('background-color', $.cookie('body_color'));   
    } 
    else { 
     $('body,.livebgchanger ul li a').css('background-color', '#003a7d'); 
    } 
    $('#picker').colpick({ 
    flat:true, 
    submit:0, 
    layout:'full', 
    color:'003a7d', //default color 
    onChange:function(hsb,hex,rgb,el){ 
     $('body,.livebgchanger ul li a').css('background-color', '#' + hex); 
     $.cookie('body_color', '#' + hex, { expires: 365 }); 
    } 
    }); 

之前（我選擇一個新的顏色和「身體」背景顏色已經改變）： click to view image

後刷新頁面：（身體的背景顏色發生了變化，但在調色板圓圈圖標和顏色是默認顏色區域） enter link description here

如何添加此選項併爲調色板中的圓形圖標設置新顏色？

對不起，我的英語。 謝謝

Answer 1

您正在硬編碼顏色選擇器的默認值。您應該將cookie值拉入變量並使用它來設置背景和顏色選擇器的顏色。

var currColor = $.cookie('body_color') || '#003a7d'; 
$('body,.livebgchanger ul li a').css('background-color', currColor);   
$('#picker').colpick({ 
    flat: true, 
    submit: 0, 
    layout: 'full', 
    color: currColor.substring(1), //skip the # 
    onChange: function(hsb, hex, rgb, el) { 
     $('body,.livebgchanger ul li a').css('background-color', '#' + hex); 
     $.cookie('body_color', '#' + hex, { 
      expires: 365 
     }); 
    } 
});