從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> 

並檢查現在