jquery - 在输入更改时更改 css

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() });
});

演示