我试图根据使用颜色输入类型的选择更改h1元素的颜色,但我似乎无法让它工作.我已经尝试将颜色变量输出到警报,它只返回undefined.
$(function(){
$("#changeColor").click(function(){
var color = $("#colorChoice").value
$("h1").css("color" + '"' + color + "'")
});
});
</script>
</head>
<html>
<body>
<h1>This is the default text</h1>
<form>
<fieldset>
<select id="changeFont">
<option>Arial</option>
<option>Georgia</option>
<option>Helevtica</option>
</select>
<input type="color" id="colorChoice">
<button id="changeColor" class="btn-primary pull-right">Change</button>
</fieldset>
</form>
Vin*_*rat 12
试着var color = $("#colorChoice").val();见jQuery的文档
您也可以在onChange事件而不是onClick事件上绑定回调:
$("#colorChoice").change(function(){
$("h1").css('background', $(this).val());
});
你的语法不正确。
JavaScript：
var color = document.getElementById("colorChoice").value;
jQuery：
var color = $("#colorChoice").val();
我推荐使用 vanilla JS，因为它比 jQuery 快。
小智 5
不要使用Jquery.vanillaJS工作正常
document.getElementById("colorChoice").value;