Javascript 用户使用HTML颜色代码选择背景色

我想找到一个javascript代码，允许用户在文本框或提示框中键入HTML颜色代码，并将页面的背景颜色更改为输入的颜色代码。到目前为止，这不起作用：
标题{ 颜色：绿色； 字体大小：250%； 背景：蓝色； } 身体{ 背景：绿色； }

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

试验


$（文档）.ready（函数（）{
$（'.sub'）。单击（函数（）{
$（'.body'）.css（'background-color'，“#”+$（'.inp'）.val（））；
});
});

---

有人知道怎么做吗？
谢谢
-A

用JSFiddle回复我的评论

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

你需要的是这个

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

<input type="text" onblur="document.body.style.backgroundColor = this.value;" id="color">

您可以更进一步，将其划分为多个函数。 这是工作票

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

这适用于文本输入（红色、蓝色、橙色）和十六进制代码（#000000）

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

对于您的代码，这里是正确的代码。Body不是类，而是标记。因此不需要选择器

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

<script type="text/javascript">

$(document).ready(function() {

$('.sub').click(function() {
    $('body').css('background-color',"#"+$('.inp').val());
    });
    });
</script>

$（文档）.ready（函数（）{
$（'.sub'）。单击（函数（）{
$（'body'）.css（'background-color'，“#”+$（'.inp'）.val（））；
});
});

试试这个：

        <header>
    <center>
    Test
    </center>
</header>
    <center>
        <br>
         <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <input type="text" class="inp" placeholder="6 digit hex value">
 <input type="submit" class="sub" value="Set Background Color">
 <script type="text/javascript">
$(document).ready(function() {
$('.sub').click(function() {
$('.body').css('background-color',"#"+$('.inp').val());
});
});
</script>
    </center>
 </div>
 </html>

$（文档）.ready（函数（）{
$（'.sub'）。单击（函数（）{
$（'.body'）.css（'background-color'，“#”+$（'.inp'）.val（））；
});
});

如果你愿意分享更多你已经做过的事情，人们可能会更愿意回答。例如，您是否已经知道如何创建文本框或提示？你能给我们看一下那个代码吗？你有没有试过…
你在谷歌上搜索过这个问题？你发现了什么？当然，我是先搜索的。我没有发现任何涉及颜色代码输入的东西。最好不要批评我查找数据的方法，或者总体上进行编码。。。实际上是在回答我的问题。谢谢如果我想改变标题的背景色怎么办？我刚刚尝试了
，但这并不意味着将其用于JSFIDLE方法
如果您继续使用上面所示的其他方法，那么就这样做<代码>$（'header'）.css（'background-color'，“#”+$（'.inp'）.val（））。本质上，头是一个标记，可以直接获取。