Javascript 从onclick selection创建名称列表

我想创建一个基于多项选择的项目列表。 我有一个组合框，可以创建（当您选择on选项时）从选项值开始的图像url

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

选择1的名称
选择2的名称
选择3的名称
选择4的名称
函数setCard1（）{
var img=document.getElementById（“scelta1”）；
img.src='immagini/collezionabili/'+this.value+'.png'；
返回false；}
document.getElementById（“menu1”）.onchange=setCard1；

我需要创建一个列表的基础上选择从图像点击。比如：点击img，在列表的“spot”1中添加this.value，选择另一个img，在“spot”2中添加this.value，依此类推。 我怎样才能做到这一点

编辑： 下拉列表为3，所有内容都相似，并且每个内容都具有相似的功能。“Spot”是表中的一行，因此，我需要将“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>

“这里的第一个onclick选项”
“第二次点击此处选择”
“第三次点击此处选择”
“第四，第一，点击此处选择”

用以下代码替换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;}

函数setCard1（）{
var img=document.getElementById（“scelta1”）；
img.src='immagini/collezionabili/'+this.value+'.png'；
//**第**行下方的更改
var myTable=document.getElementById（“表体”）；
var noOfChoices=myTable.rows.length+1；
var selectedImage=“”+noOfChoices+“此处选择”；
//向表中添加一行
myTable.append（选择图像）；
返回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>

“这里的第一个onclick选项”
“第二次点击此处选择”
“第三次点击此处选择”
“第四，第一，点击此处选择”

---

现在检查

用以下代码替换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;}

函数setCard1（）{
var img=document.getElementById（“scelta1”）；
img.src='immagini/collezionabili/'+this.value+'.png'；
//**第**行下方的更改
var myTable=document.getElementById（“表体”）；
var noOfChoices=myTable.rows.length+1；
var selectedImage=“”+noOfChoices+“此处选择”；
//向表中添加一行
myTable.append（选择图像）；
返回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>

“这里的第一个onclick选项”
“第二次点击此处选择”
“第三次点击此处选择”
“第四，第一，点击此处选择”

---

现在检查

请澄清您的具体问题或添加其他详细信息，以突出显示您所需的内容。正如目前所写的，很难说清楚你在问什么。我是JS新手，我需要创建一个表“填充”onclick，其中包含从使用上述函数创建的图像中获取的值。我有一些问题要用英语解释！你能指定什么是“点”吗？有多少张图片@Flaivo“Spot”在我的例子中，它是表格中的一行，因此：第一行中的第一个选项，第二行中的第二个选项等。该函数只创建一个图像，该选项来自3个类似的组合框，每个组合框都有一个函数。请澄清您的具体问题或添加其他详细信息，以突出显示您所需的内容。正如目前所写的，很难说清楚你在问什么。我是JS新手，我需要创建一个表“填充”onclick，其中包含从使用上述函数创建的图像中获取的值。我有一些问题要用英语解释！你能指定什么是“点”吗？有多少张图片@Flaivo“Spot”在我的例子中，它是表中的一行，所以：第一行的第一个选项，第二行的第二个选项等等。该函数只创建一个图像，该选项来自3个类似的组合框，每个组合框都有一个函数。它不起作用，这个函数打印：这里有2个选项它不起作用，这个函数打印：这里有2个选项