jQuery是.keyup函数的替代品

Question

我想知道.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/

的示例

Answer 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”页面上看到这些事件的示例。

Answer 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/