javascript - HTML5 颜色选择更改跨度颜色

Question

我正在制作一个表格，您可以在其中预览结果。我做了这个：

HTML：

<input type="color" id="color" />
<span id="colorchange">Foo</span>

JS：

 $(document).ready(function() {
    $("#color").click(function() {
         var color= $(this).attr('val'); // Not sure about this
         $("#colorchange").css("color","+color+");
    });
 });

这没有用。有任何想法吗？

谢谢！

编辑：这里的jsfiddle：http: //jsfiddle.net/xgm34/

新编辑

Answer 1

在 jQuery 中使用 change 事件：

$("#color").on('change', function() {
    $("#colorchange").css({"color":$(this).val()});
});

http://jsfiddle.net/j27Bu/

Answer 2

使用此代码 -

$(document).ready(function() {
    $("#color").change(function() {
        var color = $(this).val();
        $("#colorchange").css("color", color);
    });
});

看到这个小提琴 - http://jsfiddle.net/xgm34/10/

Answer 3

在 keyup 上使用它会在打字时改变颜色。

 $("#color").on('keyup',function() {
        $("#colorchange").css({"color":$(this).val()});

    });

http://jsfiddle.net/tamilmani/j27Bu/1/

Answer 4

你忘了关闭一些大括号和括号

$(document).ready(function() {
$("#color").click(function() {
        $("#colorchange").css("color","+color+");
  });
});

顺便一提：

• 输入中的颜色类型不存在
• 不要忘记关闭你的输入元素/>