正在尝试使用jquery获取css值

Attempting to get a css value with jquery

本文关键字：jquery 获取 css      更新时间：2023-09-26

我正在尝试获取background的css值。我的尝试失败了，没有提供正确的价值。我有一个spectrum.js颜色选择器，无论我选择哪种颜色，都会选择rgba(0,0,0,0)。当我在控制台中查看背景时，它会在DOM中正确地显示它。

有人明白为什么会失败吗？

<div class="container" id="outside-preview">
    <div class="container" id="inside-preview">
       <div id="image-square"></div>
    </div>
 </div>

$(".colorpicker").spectrum({
    color: "#FFF",
    showInput: true,
    className: "full-spectrum",
    showInitial: true,
    showPalette: true,
    showSelectionPalette: true,
    maxSelectionSize: 10,
    preferredFormat: "hex",
    localStorageKey: "spectrum.demo",
    change: function(color) {
        var eq =  $(this).index('.colorpicker');
        $('.container').eq(eq).css('background-color', color.toHexString())
    }
});
var color = $( "#outside-preview" ).css( "background-color" );
$("#result").html("That div is " + color + "");

Fiddle

您需要将读取CSS值的代码放在change处理程序中，以便在进行选择后更新#result元素。您当前的代码仅在加载时读取。

change: function(color) {
    var eq = $(this).index('.colorpicker');
    $('.container').eq(eq).css('background-color', color.toHexString())
    var color = $("#outside-preview").css("background-color");
    $("#result").html("That div is " + color);
},

更新的fiddle

相关文章：