Javascript 动态添加图像的onclick功能无法正常工作
我给每个表添加了5颗星&根据数组长度增加了表的数量。我写了一个点击功能，将greystar_图像改为greenstar_图像。当我单击任何行中的任何星形图像时，只有第一个表中的星形图像正在更改。我需要的是，当我单击特定行中的一个星号时，只有该行中的星号图像应该更改 我的代码是Javascript 动态添加图像的onclick功能无法正常工作,javascript,html,dom,Javascript,Html,Dom,我给每个表添加了5颗星&根据数组长度增加了表的数量。我写了一个点击功能，将greystar_图像改为greenstar_图像。当我单击任何行中的任何星形图像时，只有第一个表中的星形图像正在更改。我需要的是，当我单击特定行中的一个星号时，只有该行中的星号图像应该更改 我的代码是 function init() { var Ques = ['a','b','c','d','e']; var container = document.getElementById('di
function init() {
var Ques = ['a','b','c','d','e'];
var container = document.getElementById('divStars');
for(var i=0;i<Ques.length;i++){
var Table = document.createElement('table');
Table.className = 'Table';
var Row = document.createElement('tr');
Row.className = 'Row';
var Column = document.createElement('td');
var x =document.createTextNode(Ques[i]);
Column.appendChild(x);
for(j=1;j<6;j++){
var starinput = document.createElement('input');
starinput.type = 'image';
starinput.id = j;
starinput.class = 'imgclass';
starinput.src="Images/greystar.png";
Column.appendChild(starinput);
starinput.onclick = function(){
ChangeState (this.id);
function ChangeState (index) {
var colStars = divStars.getElementsByTagName ("input");
var k=0;
for(k=0;k <colStars.length;k++) {
colStars [k]. src = (k <index? "Images/greenstar.png": "Images/greystar.png");
}
}
}
}
Row.appendChild(Column);
Table.appendChild(Row);
container.appendChild(Table);
}
}
window.onload = init
</script></head>
<body><div id="divStars"> </div></body>
函数init（）{
变量Ques=['a'，'b'，'c'，'d'，'e']；
var container=document.getElementById（'divStars'）；
for（var i=0；idivStars
包含代码中的所有输入
，因此您正在对其进行全部更改。您只需在单击的输入
的父元素中获取输入
s，即可更改一行中的输入。类似如下：
starinput.onclick = function(){
ChangeState (this.id, this.parentElement);
function ChangeState (index, parent) {
var colStars = parent.getElementsByTagName ("input");
...
}
}
.divStars
包含所有的“starImages”？如果是这样，您需要在ChangeState（）
函数中将divStars
更改为此.parentElement
。@Teemu:它仍然不工作