顯示下拉選擇IMG URL中的名稱

Question

如何根據下拉選擇動態更新img URL的結束部分？ 例如，當選擇藍色時，.jog之前的文件名將被藍色字填充。它使用一個CSS，我不能任何IDS添加到：

<img src="www.mysite.com/blue.jpg"> 

<select> 
    <option>green</option> 
    <option>blue</option> 
</select> 

Answer 1

$(document).ready(function() { 
    $('select').change(function(){ 
     var src = $(':selected', this).text() 
     $('img').attr('src', location.hostname + "/" + src + '.jpg'); 
    }); 
}); 

Answer 2

試試這個：

$(function() { 
    var $img = $('img'), $select = $('select').on('change keyup', function() { 
    $img.attr('src','http://www.mysite.com/' + $select.find(':selected').html() + '.jpg')' 
    }); 
}); 

Answer 3

$(function() { 
    $('select').change(function() { 
    $(this).parent().attr('src', location.hostname + "/" + this.val() + '.jpg'); 
    }); 
});