javascript - 使用 while 循环创建多个按钮，但使用 .onclick 函数时只有第一个按钮响应

Question

大家好，我遇到了一个太小的问题，我正在创建喜欢和不喜欢的函数，所以我创建了一个 while 循环，为每个标签创建了喜欢和不喜欢的内容，但在使用 .onlick = 函数时只有第一个按钮有响应

if (mysql_num_rows($res) > 0){
while ($row = mysql_fetch_assoc($res)) {
//blah blah blah
$categories .= "<a href='view_category.php?cid=".$id."' class='cat_links'>".$title." - <font size='-1'>".$description." </a> </font> <div class='rating'><input type='button' id='like1' value='like' /><span id='temp_rating'> ".$rating." </span><input type='hidden' name='cid' id='cid' value='".$id."'/><input type='button' value='dislike' /></div>";
//blah blah blah
}
}

这是做什么的

我的 JavaScript 代码是

<script src="ajax.js"></script>
<script>
var submitEvent = document.getElementById("like1").onclick = function(){

    likemsg(HTTP);
};

</script>

ajax.js

function likemsg(){
    var temp_rating = 1;
    var cid = encodeURIComponent(document.getElementById('cid').value);

    var url = "category_like_parse.php?temp_rating="+temp_rating+"&cid="+cid;

    alert();

    HTTP.onreadystatechange=function()
    {
        if (HTTP.readyState==4 && HTTP.status==200)
        {
            document.getElementById("temp_rating").innerHTML=HTTP.responseText;
        }
    }

HTTP.open("POST", url ,true);
HTTP.send();

}

然后转到category_like_parse.php将+1保存到数据库并回显它并显示它，但仅对于第一个like按钮，其余的都没有响应我得出这个结论是因为我使用了alert();这只适用于第一个和其余的作用。我做错了什么吗？

Answer 1

这是因为您正在创建许多具有相同 id 的按钮，但这是无效的，因为 id 必须是唯一的。

而是为类似的按钮指定名称。

<input type='button' id='like1' name='like' value='like' />

var likeBut= document.getElementsByName("like");
for(var i=0;i<likeBut.length;i++){
   likeBut[i].onclick = function(){
      likemsg(HTTP);
   }
}