douzhi9478 2015-09-17 04:20
浏览 41

多个颜色选择器用于多个div更新问题

I'm adding three color pickers for three divs and added jquery for that. Here is my Code:

<script>
$(document).ready(function() {
    $('#heading_color').blur(function() {
        var headingcolor = $("#image_title_color").val();
        $("#image_title").css("color", headingcolor);
    }); 
    $('#desc_color').blur(function() {
        var desccolor = $("#image_description_color").val();
        $("#image_description").css("color", desccolor);
    }); 
    $('#button_color').blur(function() {
        var buttoncolor = $("#image_button_color").val();
        $("#image_button_text").css("color", buttoncolor);
    }); 
});

<input id="image_title" type="text" class="regular-text" name="image_title" value="<?php echo $edit_values->image_title; ?>" style="color:<?php echo $edit_values->image_title_color; ?>">

<?php $custom_color_title = $edit_values->image_title_color; 
if( $custom_color_title!= '' ) { ?>
    <input type="text" value="<?php echo $edit_values->image_title_color; ?>" class="custom_color" id="heading_color" name="heading_color" />
<?php } else { ?>
    <input type="text" value="#000" class="custom_color" id="heading_color" name="heading_color" /> <?php } ?>

<input type="hidden" value="<?php echo $edit_values->image_title_color; ?>" class="hidden_color" id="image_title_color" name="image_title_color" />



<textarea rows="5" cols="37" id="image_description" class="regular-text" name="image_description" style="color:<?php echo $edit_values->image_description_color; ?>"><?php echo $edit_values->image_description; ?></textarea>
<?php $custom_color_desc = $edit_values->image_description_color; 
if( $custom_color_desc!= '' ) { ?>
    <input type="text" value="<?php echo $edit_values->image_description_color; ?>" class="custom_color" id="desc_color" name="desc_color" />
<?php } else { ?>
    <input type="text" value="#000" class="custom_color" id="desc_color" name="desc_color" /> <?php } ?>

<input type="hidden" value="<?php echo $edit_values->image_description_color; ?>" class="hidden_color" id="image_description_color" name="image_description_color" />
</tr>



<input id="image_button_text" type="text" class="regular-text" name="image_button_text" value="<?php echo $edit_values->image_button_text; ?>" style="color:<?php echo $edit_values->image_button_color; ?>">
<?php $custom_color_button = $edit_values->image_button_color; 
if( $custom_color_button!= '' ) { ?>
    <input type="text" value="<?php echo $edit_values->image_button_color; ?>" class="custom_color" id="button_color" name="button_color" />
<?php } else { ?>
    <input type="text" value="#000" class="custom_color" id="button_color" name="button_color" /> <?php } ?>

<input type="hidden" value="<?php echo $edit_values->image_button_color; ?>" class="hidden_color" id="image_button_color" name="image_button_color" />

And other jquery for color picker is:

jQuery(document).ready(function($){
var customOptions = {
    // Declare a default color here,
    defaultColor: true,
    // a callback to fire whenever the color changes to a valid color
    change: function(event, ui){
        $("#image_button_text").css( 'color', ui.color.toString());*/
        var head_color = $( '#heading_color' ).val();
        var desc_color = $( '#desc_color' ).val();
        var btn_color = $( '#button_color' ).val();

        $( '#image_title_color' ).val( head_color );
        $( '#image_description_color' ).val( desc_color );
        $( '#image_button_color' ).val( btn_color );

        $( "#image_title" ).css( 'color', head_color);
        $( "#image_description" ).css( 'color', desc_color);
        $( "#image_button_text" ).css( 'color', btn_color);

    },
    // a callback to fire when the input is emptied or an invalid color
    clear: function() {},
    // hide the color picker controls on load
    hide: true,

    history: true,
    // show a group of common colors beneath the square
    palettes: true
};
$('.custom_color').wpColorPicker(customOptions);

});

When I submit button after selecting color it can't update the color but again I click on submit button it refelcts changes. But again when I submit button it gives previous values of color.

I want to get rid of this issue and update the new color values when I update submit button.

Thanks.

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥20 simulink单相桥式整流电路
    • ¥35 问问51单片机流水灯的代码该怎么写
    • ¥15 关于#百度#的问题:感觉已经将字体段落、字体、页边距、纸张大小、文档网络调成与论文模板一致,为什么黄色部分字体左右的间距还是不一样啊,求私信发文件接收看一下
    • ¥15 stata webuse报错
    • ¥15 TypeError: Cannot read properties of undefined (reading 'status')
    • ¥15 如何利用AI去除图片中的竹架子
    • ¥15 python 写个基金爬取的代码,自动卖出功能
    • ¥15 Linux系统启动不起来
    • ¥15 为什么运行仿真数码管不亮(语言-c语言)
    • ¥15 陈仁良《直升机飞行动力学》小扰动线化方程如何推导