jQuery 从 select 获取值然后更改 div 的 css

我一直在尝试使用这个例子，但我一生都无法让它发挥作用。
从选择中更改 Div 的背景 https://stackoverflow.com/questions/5764413/change-background-of-div-from-select

任何帮助我继续前进的意见都将非常感激

<script>
#changemybg {
       background: url(images/default.jpg) no-repeat 50% 50%;
}
</scipt>

<div id="changemybg"></div>

<select name="change" id="backgrounds">
<option>bg</option>
<option>bg1</option>
<option>bg2></option>
</select>

bg = 背景.jpg
bg1 = 背景1.jpg
bg2 = 背景2.jpg

您存储映射的方式不是很灵活。我将它们存储为一个对象。

如果你给他们起名字bg, bg2等，并且没有确定它们的范围，您需要将它们访问为window['bg' + i]这很混乱。

var bg = {
  'bg': 'background.jpg',
  'bg1': 'background1.jpg',
  'bg2': 'background2.jpg' 
};

$('#backgrounds').change(function() {
   var background = $(this).find('option:selected').text();

   if ( ! background in bg) {
       return;
   } 

   $('#changemybg').css({
      'backgroundImage': 'url(' + bg[background] + ')'
   });
});

jsFiddle http://jsfiddle.net/alexdickson/56ULy/.

或者，您可以将文件名存储在value每个的属性option元素并简单地分配backgroundImage to $(this).val().

另外，您正在尝试在script元素。那是行不通的；你想要的是style元素。