onchange 在被 javascript 修改时不会触发答案

【问题标题】：onchange doesn't fire when modified by javascriptonchange 在被 javascript 修改时不会触发
【发布时间】：2015-04-05 23:13:31
【问题描述】：

我正在使用频谱 (https://github.com/bgrins/spectrum)，这是一个用于调色板的 jQuery 插件。我的目标是在用户浏览不同颜色时直接将颜色应用于背景。

到目前为止，我所拥有的是：

//*****Part of a 3rd party file, which I cannot modify****
$("#picker1").spectrum({
    allowEmpty:true,
    color: "#ECC",
    showInput: true,
    preferredFormat: "hex",
}); 
//***********************************


$("#picker1").on("change keyup paste", function(){
    newcolor=$("#picker1").val();
    $(".menu-itempreview").css("background-color", newcolor);     
});



<ul id="menu-primary-menupreview" class="someclass">
    <li class="menu-itempreview">Home</li>
    <li class="menu-itempreview">Sample Page</li>
    <li class="menu-itempreview">Uncategorized</li>
</ul>


<input type='input' id="picker1" />

在这里拉我一把：http://jsfiddle.net/h4Lc5b6a/

问题是，颜色只有在用户点击提交按钮时才会更新。我怎样才能做到这一点，以便在用户浏览不同颜色时动态更新背景？

似乎问题在于 onchange，当输入字段被 javascript 修改时，它不会触发。

【问题讨论】：

这里是一个例子：jsfiddle.net/ys8oL94w 那个小提琴的问题是，我必须修改第 3 方 jquery 代码，而我无法在我的实际项目中修改。

标签： javascript jquery css spectrum

【解决方案1】：

您可以使用 move 回调 (http://bgrins.github.io/spectrum/#events-move)。
添加到您的频谱初始化：

$("#picker1").spectrum({
    //...,
    move: function(color) {
        $(".menu-itempreview").css("background-color",  color.toHexString());
    }
});

您也可以在频谱初始化后使用this：

// Alternatively, they can be added as an event listener:
$("#picker").on('move.spectrum', function(e, tinycolor) { });
$("#picker").on('show.spectrum', function(e, tinycolor) { });
$("#picker").on('hide.spectrum', function(e, tinycolor) { });
$("#picker").on('beforeShow.spectrum', function(e, tinycolor) { });

【讨论】：