Question

我正在尝试从jQuery colorpicker插件中选择十六进制值，并使用jQuery cookie插件将其存储为cookie。

我只是不知道将两者结合在一起的适当方法（js和jQuery新手）。

这是我的colorpicker函数：

    $('#colorSelector').ColorPicker({
color: '#ffffff',
onShow: function (colpkr) {
    $(colpkr).fadeIn(500);
    return false;
},
onHide: function (colpkr) {
    $(colpkr).fadeOut(500);
    return false;
},
onChange: function (hsb, hex, rgb) {
    $('#colorSelector div, .preview-image, .cover ').css('backgroundColor', '#' + hex);
    $('body').css('backgroundColor', '#' + hex);
        $.cookie('bgColor', 'picker');
    return false;
}
});

这是我的cookie功能：

    var bgColor = $.cookie('bgColor');  

if (bgColor == 'picker') {  
$('#colorSelector div, .preview-image, .cover ').css('backgroundColor', '#' + hex);  
};

我可以将cookie值设置并存储为标准的css背景颜色，但无法弄清楚如何将“'backgroundColor'，'＃'+ hex”值拉入cookie函数。

Answer 1

onChange函数中的

：

$.cookie('bgColor', '#' + hex);

和cookie函数

var bgColor = $.cookie('bgColor');      
if (typeof bgColor == 'string' && bgColor.charAt(0)=='#') {  
  $('#colorSelector div, .preview-image, .cover ').css('backgroundColor', bgColor);  
};

Answer 2

根据需要更改身体选择器。

    (function($){



    var initLayout = function() {
        var hash = window.location.hash.replace('#', '');
        var currentTab = $('ul.navigationTabs a')
                            .bind('click', showTab)
                            .filter('a[rel=' + hash + ']');
        if (currentTab.size() == 0) {
            currentTab = $('ul.navigationTabs a:first');
        }
        showTab.apply(currentTab.get(0));
        $('#colorpickerHolder').ColorPicker({flat: true});
        $('#colorpickerHolder2').ColorPicker({
            flat: true,
            color: '#00ff00',
            onSubmit: function(hsb, hex, rgb) {
                $('#colorSelector2 div').css('backgroundColor', '#' + hex);
            }
        });
        $('#colorpickerHolder2>div').css('position', 'absolute');
        var widt = false;
        $('#colorSelector2').bind('click', function() {
            $('#colorpickerHolder2').stop().animate({height: widt ? 0 : 173}, 500);
            widt = !widt;
        });
        $('#colorpickerField1, #colorpickerField2, #colorpickerField3').ColorPicker({
            onSubmit: function(hsb, hex, rgb, el) {
                $(el).val(hex);
                $(el).ColorPickerHide();
            },
            onBeforeShow: function () {
                $(this).ColorPickerSetColor(this.value);
            }
        })
        .bind('keyup', function(){
            $(this).ColorPickerSetColor(this.value);
        });

            var bgColor = $.cookie('bgColor');      
            if (typeof bgColor == 'string' && bgColor.charAt(0)=='#') {  
            $('body').css('backgroundColor', bgColor);  
            };


        $('#colorSelector').ColorPicker({
            color: '#0000ff',
            onShow: function (colpkr) {
                $(colpkr).fadeIn(500);
                return false;
            },
            onHide: function (colpkr) {
                $(colpkr).fadeOut(500);
                return false;
            },
            onChange: function (hsb, hex, rgb) {
            $('body').css('backgroundColor', '#' + hex);
            $.cookie('bgColor', '#' + hex);
            }


        });
    };

    var showTab = function(e) {
        var tabIndex = $('ul.navigationTabs a')
                            .removeClass('active')
                            .index(this);
        $(this)
            .addClass('active')
            .blur();
        $('div.tab')
            .hide()
                .eq(tabIndex)
                .show();
    };

    EYE.register(initLayout, 'init');
})(jQuery)

将值从一个jQuery函数拉到另一个jQuery函数中

2 个答案: