jQuery 替代 .keyup 函数答案

【问题标题】：jQuery an alternative to .keyup functionjQuery 替代 .keyup 函数
【发布时间】：2011-03-03 00:09:57
【问题描述】：

我想知道.keyup 函数的替代方法。示例

$(".color").keyup(function () {
    var top_header = $("#top_header").val();
    $("#top").css("background-color", top_header);
});

<input value="#121212" class="color" id="top_header" type="text" />

当我们键入输入文本时，此代码将使用新背景更改id='top'。

现在我将其更改为jscolor 到该字段。所以当我们点击文本输入时会显示颜色生成器。

问题

我应该用什么替换.keyup(function ()来使颜色立即改变而无需输入？

不使用jscolor的例子http://jsfiddle.net/5dsXT/

【问题讨论】：

颜色已经在 jscolor 网站上发生了变化，不是吗？ jscolor.com
当我查看 jscolor 时，它似乎会在您键入时改变颜色，就像您的 jsfiddle 示例一样。你能澄清一下你想要做的更多吗？也许不起作用的一个例子可能会有所帮助......
是的.. 实际上在 div id='top'

标签： javascript jquery

【解决方案1】：

您正在寻找onChange 事件尝试将.keyup() 函数替换为.change()。

示例

$(document).ready(function () {
    $(".color").change(function () {
        var top_header = $("#top_header").val();
        $("#top").css("background-color", top_header);
    });
});

<input value="#121212" class="color" id="top_header" type="text" />

编辑您可以在他们的“tweaking”页面上查看他们使用事件的示例。

【讨论】：

@Woho87 - 谢谢。我自己去过那里几次。 :)

【解决方案2】：

我不确定你在问什么，但如果你想将两个事件绑定到那个 texbox，你可以试试这个：

$(document).ready(function () {
    $("#top_header").bind("keyup focus", function() {
        $("#top").css("background-color", $(this).val());
    });
});

http://jsfiddle.net/5dsXT/2/

如果您想处理初始页面加载、焦点和键位，您可以这样做：

$(document).ready(function () {
    SetColor();
    $("#top_header").bind("keyup focus", SetColor);        
    function SetColor()
    {
        $("#top").css("background-color", $("#top_header").val());
    }
});

http://jsfiddle.net/5dsXT/1/

【讨论】：

这不能回答问题。 OP 没有询问如何绑定两个事件处理程序。
@Drackir 实际上这个工作对我有好处：)
@Unkown 错误：啊，选择颜色时必须触发焦点事件。不过，我仍然认为 onchange 更合适。