Как получить динамический идентификатор поста или значение в скрипте jquery - PullRequest
Новая
       9

Как получить динамический идентификатор поста или значение в скрипте jquery

0 голосов
/ 17 марта 2012

Я работаю над небольшим плагином WordPress "Оцените все, что угодно".Этот плагин хорошо работает с отдельными постами, но на странице блога, когда есть несколько постов, плагин не может увидеть, с какого идентификатора поста был сделан клик.Он всегда принимает первое значение страницы.

Я добавил идентификатор записи в 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);
            });
        });
    });

Iставьте статически «1» после некоторых элементов id и class, чтобы проверить, как будет решена моя проблема, он отлично работает с Post 1, id и значение которого равны «1», теперь мне нужно заменить «1» в конце #post_id, .vote_succ, .up_perc, .down_perc динамическим кодом, чтобы он работал с динамическими элементами, сгенерированными кодом php.

Спасибо за вашу помощь.

1 Ответ

2 голосов
/ 17 марта 2012

Вам нужно изменить свой код так, чтобы он работал на единице, на которую щелкнули, а не на всех объектах этого класса на всей странице.Самый простой способ сделать это - поместить каждую единицу в контейнер div таким образом и использовать только имена классов, без значений идентификаторов: 

<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);
        });
    });
});
...