Сообщение Jquery не меняет значение при ответе

У меня есть jquery, который запускается при нажатии на ссылку (ниже). Это позволяет отправлять данные в базу данных mysql, а затем обновлять значение определенного <p>. Однако это не работает. Я добавил alert(response) и получаю правильный результат, но <p> не меняется, что, вероятно, означает, что я использую неправильный селектор.

JЗАПРОС:

$('.upVote').click(function(e){

    e.preventDefault();

        answer_id = $(this).siblings('.record_id').attr('value');

        $.post('../answerrating.php' , {answer_id: answer_id} , function(response){

            $(this).prev('.ratingBox').val(response);
        });

});

HTML:

<p class='ratingBox'> $answerrating[$f]</p>
                     <a href='#' class='upVote'>Upvote</a> <a href='#' class='downVote'>Downvote</a>
                    <input type='hidden' name='record_id' value='$answerid[$f]' class='record_id' />

person kirby    schedule 11.01.2012    source источник
comment
что такое ответ?? хтмл ????   -  person dku.rajkumar    schedule 11.01.2012
comment
Ответ @dku.rajkumar — это число, которое выводится из php, например «25». я бы хотел, чтобы этот номер был внутри .ratingBox   -  person kirby    schedule 11.01.2012
comment
возможный дубликат как получить доступ к $(this) внутри функция обратного вызова успеха ajax   -  person Andrew Whitaker    schedule 11.01.2012
comment
попробуйте мой ответ... надеюсь, это сработает   -  person dku.rajkumar    schedule 11.01.2012


Ответы (3)


попробуй это.

$('.upVote').click(function(e){    
    e.preventDefault();    
    var target_elem = $(this).prev('.ratingBox');
        answer_id = $(this).siblings('.record_id').attr('value');    
        $.post('../answerrating.php' , {answer_id: answer_id} , function(response){    
            target_elem.text(response);
        });    
});
person dku.rajkumar    schedule 11.01.2012

this не будет ссылаться на элемент, который был нажат внутри вашего обратного вызова AJAX. Попробуйте вместо этого сохранить контекст обработчика событий и использовать его в своей функции обратного вызова.

Кроме того, вы должны использовать .text() или .html() при изменении содержимого элементов, отличных от input:

$('.upVote').click(function(e){
    var self = this;

    e.preventDefault();

        var answer_id = $(this).siblings('.record_id').attr('value');

        $.post('../answerrating.php' , {answer_id: answer_id} , function(response){

            $(self).prev('.ratingBox').html(response);
        });

});
person Andrew Whitaker    schedule 11.01.2012
comment
@ user802370: Как выглядит ответ? Это то, что вы ожидаете? - person Andrew Whitaker; 11.01.2012
comment
@user802370: Ой! Только что заметил еще одну проблему — обязательно используйте .text() или .html() вместо val для тегов p. - person Andrew Whitaker; 11.01.2012

Ошибка, вероятно, связана с тем, что значение специальной переменной this внутри обратного вызова успеха .post()s почти наверняка не является элементом DOM, на который отвечал обработчик события щелчка.

Чтобы решить эту проблему, установите переменную для значения this в обратном вызове клика и обратитесь к ней внутри обратного вызова успеха. В целом это хорошая практика, когда вы не уверены на 100%, каким будет значение this, поскольку оно значительно зависит от контекста.

$('.upVote').click(function(e){
    var button = this;
    e.preventDefault();    
    answer_id = $(this).siblings('.record_id').attr('value');

    $.post('../answerrating.php' , {answer_id: answer_id} , function(response){
        $(button).prev('.ratingBox').val(response);
    });
});
person GregL    schedule 11.01.2012
comment
Вероятно, также полезно изменить строку answer_id на var answer_id = $(button)..., обязательно используя ключевое слово var, чтобы избежать создания глобальной переменной. - person GregL; 11.01.2012