jquery select option

Question

我对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> 

Answer 1

上例如选择列表的值添加一个ID您h1和你的颜色（十六进制值），然后设置按钮，单击时的brackground：

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> 

JQuery的

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

Answer 2

首先，你应该给选择一个ID属性是jQuery的可能访问。例如，您可以使用与名称bgColor相同的名称。比代码如下：

$('#bgColor').val()