Javascript 如果表很大，我对表中元素的一点ajax就会中断。如何修复？

我有一个包含多个由php/mysql生成的表的页面。其中一个元素是“输入/输出”按钮。我有它的ajax'ed，使按钮更改为打开或关闭图像与每次点击，而无需重新加载页面

而且它很有魅力！直到它没有。如果一个表或多个表的组合超过这么多行，它将停止工作。但仍适用于其上方的行。为什么会这样

下面是表生成…这发生在多个php文件中

<tbody>
<?php while($row = MySQL_fetch_array($result)):
$id = htmlentities($row['id']);
$status = htmlentities($row['status']);
include ("button.php");
?>
<tr>
        <td title="lname" width="100px">
            <div style="width:100px; overflow:hidden;">
                <?php echo(htmlentities($row['last_name'])); ?>
            </div>
        </td>
        <td width="100px">
            <div style="width:100px; overflow:hidden;">
                <?php echo(htmlentities($row['first_name'])); ?>
            </div>
        </td>    
        .
        .
        .
        <td>
        <div style="width:100px; overflow:hidden;">
                <?php echo '<div><div id="r'.$id.'"><div id="test"><img class="rating" id="'.$status.$id.'" src="'.$color.'"><div style="display:none;">'.$status.'</div></div></div></div>';?>
        </div>
        </td>
</tr>
<?php endwhile; ?>

.
.
.

以下是脚本：

<script>
        $(function(){
            $(document).on("click", ".rating", function(){
                var status = $(this).attr("id").substr(0,1);
                var id = $(this).attr("id").substr(1);
                var data = "id="+id+"&status="+status;

                $.ajax({
                    type: "POST",
                    url: "rate.php",
                    data: data,
                    success: function(e){
                    $("#r"+id).html(e);
                }

            })
        });
    });
    </script>

$（函数（）{
$（文档）。在（“单击”，“评级”，函数（）上）{
var status=$（this.attr（“id”）.substr（0,1）；
var id=$（this.attr（“id”）.substr（1）；
var data=“id=“+id+”&status=“+status；
$.ajax({
类型：“POST”，
url:“rate.php”，
数据：数据，
成功：职能（e）{
$（#r+id）.html（e）；
}
})
});
});

下面是上面代码中引用的rate.php：

<?php
include ("db.php");
$id = $_POST["id"];
$newstatus = $_POST["status"];

if($newstatus == 0){
    mysql_query("UPDATE users SET status = 1 WHERE id='$id'");
}
else {
    mysql_query("UPDATE users SET status = 0 WHERE id='$id'");
}
include("button.php"); //FILE WITH THE LIKE & DISLIKE BUTTONS AND THE NUMBER OF LIKES & DISLIKES

$list = '<div id="test"><img class="rating" id="'.$q[0].$id.'" src="'.$color.'"><div style="display:none;">'.$q[0].'</div>';

echo $list;
?>

---

在注释中调试时，发现使用了重复的id。ID在单个页面中必须是唯一的，否则可能会出现意外结果（如问题中描述的问题）

要测试重复的id，请使用属性等于选择器

console.log($("[id=" + theidtotest + "]").length)

如果从该行中获取的元素超过1个，则说明您做错了。
ajax请求停止工作时是否仍在发送？这件事发生了吗？请求失败了吗？我们需要知道为什么它不起作用。仅仅知道它不起作用并不能真正帮助我们帮助你。它在做一些事情……但只有一次。在不工作的行上，图像永远不会更改为相反的输入/输出图像。但是第一次单击确实会更改mysql数据库中的值。但是，第二次单击不再进行更改。这些行上方的工作行工作正常。图像在每次鼠标点击时都会改变，mysql数据库中的值在每次鼠标点击时都会改变……它会无限期地改变。不确定这是否能帮你弄清楚到底发生了什么！向$.ajax添加一个错误回调，并检查它接收到的三个参数。不知道如何执行。在我的ajax中添加了以下内容：“错误：函数（xhr，error）{console.debug（xhr）；console.debug（error）；}”。但它在Chrome的控制台上什么也没显示。这是你的问题。您有重复的id:）
console.log($("[id=" + theidtotest + "]").length)