0

我正在开发一个小的 wordpress 插件“评价我的任何东西”。该插件在单个帖子上运行良好，但在博客页面上，当有多个帖子时，插件无法查看点击是从哪个帖子 ID 完成的。它始终采用页面的第一个帖子值。

我已将 post id 添加到 id 和类名以解决问题（例如：post_id$post->ID），但现在我被阻止以这种方式编辑 jquery 文件。

投票后项目的 php 代码：

 <input type=\"hidden\" id=\"post_id$post->ID\" value=\"" . $post->ID . "\" />
    <div class=\"vote\">
<table>
    <tr><td>
    <a class=\"vote_up\" href=\"#\"></a></td>
<td>
    <a class=\"vote_down\" href=\"#\"></a></td></tr>
    <tr>
<td class=\"up_perc$post->ID\">" . get_percentage(1, $post->ID ) ."%</td>
<td class=\"down_perc$post->ID\">" . get_percentage(2, $post->ID) . "% </td>
</tr>
    </table></div>

 <div class=\"vote_succ$post->ID\"></div>

jquery 代码（赞成票，反对票是一样的）：

jQuery(document).ready(function($) { 


        $(".vote_up").click(function(e) { 
        e.preventDefault();

        $.post('/wp-content/plugins/rate-my-whatever/rate.php', {vote_type: "1", post_id: $("#post_id1").val()}, function(data) {

            $(".vote_succ1").html(data);
            $.post('/wp-content/plugins/rate-my-whatever/rate.php', {action: "getPercentage",  vote_type: "1", post_id: $("#post_id1").val()}, function(data2) {
                $(".up_perc1").html(data2);
            });
            $.post('/wp-content/plugins/rate-my-whatever/rate.php', {action: "getPercentage", vote_type: "2", post_id: $("#post_id1").val()}, function(data3) {
                $(".down_perc1").html(data3);
            });
        });
    });

我在一些 id 和 class 元素之后静态放置了“1”以检查我的问题将如何解决，它适用于 id 和 value 为“1”的 Post 1，现在我需要替换 # 末尾的“1” post_id、.vote_succ、.up_perc、.down_perc 通过动态代码使其与 php 代码生成的动态元素一起工作。

谢谢你的帮助。

4

1 回答 1

2

您需要更改您的代码，以便它在单击的单元上运行，而不是在整个页面中该类的所有对象上运行。最简单的方法是将每个单元放在这样的容器 div 中，并且只使用类名，不使用 ID 值：

<div class=\"voteUnit\">
    <input type=\"hidden\" class=\"post_id\" value=\"" . $post->ID . "\" />
    <div class=\"vote\">
    <table>
        <tr>
            <td><a class=\"vote_up\" href=\"#\"></a></td>
            <td><a class=\"vote_down\" href=\"#\"></a></td>
        </tr>
        <tr>
            <td class=\"up_perc\">" . get_percentage(1, $post->ID ) ."%</td>
            <td class=\"down_perc\">" . get_percentage(2, $post->ID) . "% </td>
        </tr>
    </table>
    </div>

    <div class=\"vote_succ\"></div>
</div>

并且，然后更改代码以在被点击的同一投票单元中查找相关对象，方法是使用$(this).closest('.voteUnit').find()在点击的投票单元中查找对象，而不是查看整个网页并在所有投票单元中查找对象。 .closest('.voteUnit')从单击的项目中查找祖先链，直到找到带有class=voteUnit. 然后代码可以使用它作为子树来搜索投票单元中的其他对象。

jQuery(document).ready(function($) { 
    $(".vote_up").click(function(e) { 
        var unit$ = $(this).closest('.voteUnit');
        e.preventDefault();

        $.post('/wp-content/plugins/rate-my-whatever/rate.php', {vote_type: "1", post_id: unit$.find(".post_id").val()}, function(data) {

        unit$.find(".vote_succ").html(data);
        $.post('/wp-content/plugins/rate-my-whatever/rate.php', {action: "getPercentage",  vote_type: "1", post_id: unit$.find(".post_id").val()}, function(data2) {
            unit$.find(".up_perc").html(data2);
        });
        $.post('/wp-content/plugins/rate-my-whatever/rate.php', {action: "getPercentage", vote_type: "2", post_id: unit$.find(".post_id").val()}, function(data3) {
            unit$.find(".down_perc").html(data3);
        });
    });
});
于 2012-03-17T16:56:04.753 回答