Question

所以我得到了一个id为mySelect的选择器。

<select name="mySelect" id="mySelect">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>      
</select>

如果选择了其中一个选项，我想将jquery中的变量颜色设置为一个值。然后使用这个颜色变量。

var color; 
    $('#mySelect option:selected').change(function(){ 

    if($(this).val() == '1') {
    color = #000080;    
    return color;
    }
    if($(this).val() == '2') {
    color = #ff0000;    
    return color;
    }
});

jquery代码不正确，我似乎无法解决它..

Answer 1

更改事件应位于select元素上，而不是option:selected上，请尝试以下操作：

var color; 
$('#mySelect').change(function(){ 

    if($(this).val() == '1') {
        color = "#000080";//<- Needs to be a string  
        return color;
    }
});

需要注意的事项：

我已将选择器更改为使用正确的ID（#mySelect），但我认为这是您的错字？
您实际上不需要将option:selected用于value，但您需要这是您想要访问所选的option DOM元素（例如获取{{1} }}）
我修改了你的颜色字符串（见上面的评论）
不确定您使用text语句的原因，您可能应该删除此

Here is a working example

高级解决方案

我建议您不要使用一组if / else语句来使用数组来存储颜色列表，而是可以使用return作为索引（不要忘记减去1因为它是基于零的）。像这样：

val()

Here is an example

Answer 2

$('#categorie option:selected') // This is for selected option which won't work 
                                // change event handler

将其更改为选择标记

$('#mySelect').change(..  //also change your id

Answer 3

试试这个

var color; 
$('#mySelect').change(function(){ 

  switch($(this).val()) {
    case "1": color = "#000080";break;
    case "2": color = "#FF0080";break;
    case "3": color = "#EE0080";break;
  }
  alert(color);
});

http://jsfiddle.net/Pesulap/cMLmU/1/

Answer 4

你需要这个：

$(function() { $('#mySelect').on('change',function(){ if($(this).val()==1) { /*do stuff here*/ } }); });

现场演示：http://jsfiddle.net/PwMxk/1/

如果选择了选项，则更改变量

4 个答案: