javascript - 像堆栈溢出一样跨越 upvote 插件时显示错误

Question

我有一个 jQuery up vote 插件。除了错误处理，一切都工作正常。我的投票插件在 foreach 循环中。像下面这样

  if($RES['counter'] === '1'){
     echo '
             <td>
               <div  data-id='.$id.' class="upvote upvote-serverfault">
                <a style="cursor:pointer;" class="upvote upvote-on" title="This idea is helpful"></a>
                <span class="count">'.$counter.'</span>
                <a class="downvote"></a>
                <span id='.$index.'><span class="votingFeedback"></span>
              </div>
          </td>';  
        }
        else 
            if($RES['counter'] === '-1'){
        echo '
          <td>
            <div  data-id='.$id.' class="upvote upvote-serverfault">
                <a style="cursor:pointer;" class="upvote upvote-down" title="This idea is helpful"></a>
                <span class="count">'.$counter.'</span>
                <a class="downvote downvote-on"></a>
                <span id='.$index.'><span class="votingFeedback"></span>  
            </div>
          </td>';
        }

问题是当用户试图跨越我的投票系统时它会抛出一个错误。错误检查是在我的 PHP 文件中完成的并且它正在工作但是当我试图在屏幕上显示错误而不是在屏幕上显示消息时特定主题是否显示在所有主题 id 上

我试图做一些类似堆栈溢出的事情。如果你试图跨越赞成票或反对票，它会抛出错误，但它似乎比我想象的要难

我对 php 文件的 ajax 调用

<script>
var callback = function(data) {
    $.ajax({
        url: 'voting.php',
        type: 'post',
        data: { id: data.id, up: data.upvoted, down: data.downvoted, star: data.starred },
        success: function(data) {      
        $(".votingFeedback").html(data);
    }
    });
};
$('.upvote').upvote({callback: callback});

 </script>

Answer 1

当您从 ajax 请求获得响应时，您选择了页面上的所有投票反馈元素，因为您使用的是类选择器。这是用 votingFeedback

类更新所有范围

您需要使用对要更新的元素唯一的选择器。您已经有一个带有 id 的容器 div。将其用作选择器的一部分。

$("[data-id='"+ data.id + "'] .votingFeedback").html(数据);


但是您还需要重命名成功函数的参数，因为您定义了两次 data。这将意味着 data.id 不再存在。将其重命名为 response 或重命名外部函数的参数。