从onclick选项创建名称列表

Question

我想根据多个选择创建项目列表。 我有一个组合框创建（当你选择选项时）从选项的值开始的图像的网址。

<span> 
<select id="menu1"> 
<option value="xx1" id="xx1">Name of selection 1</option> 
<option value="xx2" id="xx2">Name of selection 2</option> 
<option value="xx3" id="xx3">Name of selection 3</option> 
<option value="xx4" id="xx4">Name of selection 4</option> 
</select> 
</span> 

<span class="first"> 
<img id="scelta1" src="" alt="Prima Scelta"> 
</span> 

function setCard1() { 
var img = document.getElementById("scelta1"); 
img.src = 'immagini/collezionabili/' + this.value + '.png'; 
return false;} 
document.getElementById("menu1").onchange = setCard1; 

我需要创建一个基于点击图像选择的列表。例如：点击img，在列表的“spot”1中添加this.value，选择另一个img，在“spot”2中添加this.value，依此类推。 我该如何做到这一点？

编辑： 下拉是3，所有类似和每个类似的功能。 “点”是在表中的行，所以，我需要把“THIS.VALUE”成表所示：

<table id="mazzo"> 
<tr><td id="pick01">"first onclick choice here"</td></tr> 
<tr><td id="pick02">"second onclick choice here"</td></tr> 
<tr><td id="pick03">"third onclick choice here"</td></tr> 
<tr><td id="pick04">"forth first onclick choice here"</td></tr> 
</table> 

Answer 1

下面的代码替换setCard1功能：

function setCard1() { 
var img = document.getElementById("scelta1"); 
img.src = 'immagini/collezionabili/' + this.value + '.png'; 


//**Change below line** 

var myTable=document.getElementById("tableBody"); 

var noOfChoices = myTable.rows.length+1; 
var selectedImage = "<tr><td id='pick'"+noOfChoices+">"+noOfChoices+" choice here</td></tr></tr>"; 
//Add a row to table 
myTable.append(selectedImage); 

return false;} 

更改您的表如下

<table id="mazzo"> 
<tbody id="tableBody"> 
<tr><td id="pick01">"first onclick choice here"</td></tr> 
<tr><td id="pick02">"second onclick choice here"</td></tr> 
<tr><td id="pick03">"third onclick choice here"</td></tr> 
<tr><td id="pick04">"forth first onclick choice here"</td></tr> 
</tbody> 
</table> 

并检查现在