2012-03-15 82 views
0

我的CS-Cart安裝中有一個下拉選項框,它具有動態創建的值,例如, 3110,3111,3112,3113 ....在下拉框中更改圖片

我需要根據下拉列表中選擇的值在下拉菜單中更改圖像。

我正在看這個腳本 - http://www.javascriptkit.com/script/cut173.shtml,但是使用它將取決於使用手動創建的值。 (見下面的代碼)

腳本:

<script language="javascript"> 
<!-- 
function showimage() 
{ 
if (!document.images) 
return 
document.images.pictures.src= 
document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value 
} 
//--> 
</script> 

HTML:

<table border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="100%"><form name="mygallery"><p> 
<select name="picture" size="1" onChange="showimage()"> 
<option selected value="image1.gif">Picture of me</option> 
<option value="image2.gif">Picture of my aunt</option> 
<option value="image3.gif">Picture of my brother</option> 
</select> 
</p> 
</form> 
</td> 
</tr> 
<tr> 
<td width="100%"><p align="center"><img src="image1.gif" name="pictures" width="99" height="100"></td> 
</tr> 
</table> 

什麼我必須這樣做它引用在下拉菜單中的價值?這是一個一次性的產品,只需要做這個,所以不用擔心值的變化等...

這是在我需要的頁面的前端生成的代碼腳本聯想到:

<select name="product_data[29821][product_options][742]" id="option_29821_742" onchange="fn_change_options('29821', '29821', '742');" > 
<option value="">Choose...</option>                  <option value="3111" >LC </option> 
<option value="3110" >LC/A </option> 
<option value="3112" >E2000 </option> 
<option value="3113" >E2/A </option> 
<option value="3114" >FC /option> 
<option value="3115" >FC/A </option> 
<option value="3116" >ST </option> 
<option value="3117" >SC </option> 
<option value="3118" >SC/A </option> 
</select> 

回答

1

以下是您需要做的事情:

function listen(event, elem, func) { 
    if (elem.addEventListener) { 
    elem.addEventListener(event, func, false); 
    } else if (elem.attachEvent) { 
    elem.attachEvent(event, func); 
    } 
} 

var select = document.getElementById('picture'); // give your select element an ID for ease and speed of DOM traversal 

listen('change', select, function() { 
    var val = this.options[this.selectedIndex].value; 
    var image = new Image(); 
    image.src = val; 
}); 
0

下面的代碼將提醒在onchange事件選擇的值(不是文本,值)

function selectOnchange(slt) { 
    alert(slt.value); 
} 

<select onchange="selectOnchange(this)"></select> 

這可能會幫助你