0

我为每个表添加了 5 颗星，并且根据数组长度添加了没有表。我写了一个点击功能来给 graystar_image 更改为 greenstar_image 的图像加注星标。当我单击任何行中的任何星形图像时，只有第一个表中的星形图像会发生变化。我需要的是，当我单击特定行中的星时，只有该特定行中的星图应该改变。

我的代码是；

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

1 回答 1

0

divStars包含inputs代码中的所有内容，因此您正在更改它们。您只需要input在单击的父元素中获取 sinput即可更改一行中的输入。像这样的东西：

starinput.onclick = function(){ 
    ChangeState (this.id, this.parentElement);
    function ChangeState (index, parent) { 
        var colStars = parent.getElementsByTagName ("input");
                    ...
    }
}

jsFiddle 的现场演示。

于 2013-07-16T08:00:29.210 回答