Select Jquery选择选项

我对jQuery很陌生，想知道如何在下拉菜单中选择一个选项

更具体地说： 您可以在下拉菜单中选择一种颜色，当您单击按钮时，背景颜色将更改为该颜色

提前谢谢

以下是HTML：

    <div id="form-box">
        <h1>Funky Background Color Changer</h1>
        <p>1. Choose a funky background color:
            <select name="bgColor" id="">
                <option value="$juicy-cyan">Juicy Cyan</option>
                <option value="$purdy-purple">Purdy Purple</option>
            </select>
        </p>
        <p>2. That's it actually! Just click the button.</p><br>
        <button class="funk">Let's Funk!</button>
    </div>

时髦的背景颜色变换器
一,。选择一种时髦的背景色：
多汁青色
淡紫色

二,。事实上就是这样！只需单击按钮。


让我们害怕吧！

首先，您应该给select一个jQuery可以访问的id属性。例如，您可以使用与bgColor相同的名称。代码将是：

$('#bgColor').val()

---

例如，在您的

h1

中添加一个ID，并在所选列表的值上添加颜色（十六进制值），然后在单击按钮时设置括号圆形：

Html

<div id="form-box">
        <h1 id="h1_id">Funky Background Color Changer</h1>
        <p>1. Choose a funky background color:
            <select name="bgColor" id="bgColor_id">
                <option value="#ff0000">Juicy Cyan</option>
                <option value="#0066ff">Purdy Purple</option>
            </select>
        </p>
        <p>2. That's it actually! Just click the button.</p><br>
        <button class="funk" id="submitButton">Let's Funk!</button>
    </div>

---

我可以使用SASS变量而不是十六进制颜色吗？@Jordanhueten从未使用过SASS，因此无法帮助您。但是试着用sass变量替换十六进制值，看看结果

$('#submitButton').on('click', function () {
    var color = $("#bgColor_id").val();
    $("#h1_id").css('background-color', color);
});