Question

为什么它适用于“红色”

var inputButtonColor = $('input#button-color');

inputButtonColor.change(function() {
  var inputButtonColorValue = inputButtonColor.val();
  alert(inputButtonColorValue);
  $('input.write-review').css({"background-color": "red" });
});

http://jsfiddle.net/f4ngg/2/

这不是“inputButtonColor.val（）”

var inputButtonColor = $('input#button-color');

inputButtonColor.change(function() {
  var inputButtonColorValue = inputButtonColor.val();
  alert(inputButtonColorValue);
  $('input.write-review').css({"background-color": inputButtonColorValue });
});

http://jsfiddle.net/f4ngg/1/

Answer 1

您需要在双引号之外删除变量，否则它将被视为字符串。更正的行：

 $('iframe').contents().find('input.write-review').css({"background-color": inputButtonColor.val()});

希望有所帮助！

Answer 2

您正在将颜色代码作为文本框中的输入，如果您想将其更改为颜色，则必须在颜色代码之前添加#。

所以代码将是：

var inputButtonColor = $('input#button-color');

inputButtonColor.change(function() {
  var inputButtonColorValue = inputButtonColor.val();
  alert(inputButtonColorValue);
  $('input.write-review').css({"background-color": "#" + inputButtonColor.val() });
});

DEMO

改变输入变化的css

2 个答案: