在ajax回调之后更改内部文本不起作用?

时间:2015-04-22 17:21:29

标签: jquery ajax asp.net-mvc

我在页面上有十个像按钮,我是通过页面上的foreach循环创建的。

我在使用jQuery更改内部文本时遇到问题。

让我用我的元素解释

     <a class="pr-endorse" id="<%=product.ConfectionaryProductId %>">
        <i class="pr-add"></i>
        <span>+</span>
        <span class="pr-likes"><%=product.EndorsementCount %></span>
    </a>

这是我喜欢的按钮元素之一。

这是提交用户的Ajax函数,如

      $(document).ready(function () {
        $(".pr-endorse").click(function () {
            debugger;
            var productId = $(this).attr("id");
            var confId = $("#ConfectioneryId").val();
            var countNumber = $(this).find(".pr-likes").html();
            $.ajax({
                url: '<%: Url.Action("Endorsement","Confectionery")%>',
                data: { productId: productId, itemId: confId },
                type: "POST",
                async: true,
                cache: false,
                success: function (result) {

                    debugger;
                    $(this).find(".pr-likes").text(result.endoresCount);
                    alert(result.endoresCount);

                },
                error: function (xhr) {
                    alert(xhr);
                }

我认为这部分代码应该解决

  $(this).find(".pr-likes").text(result.endoresCount);

但它不起作用?

2 个答案:

答案 0 :(得分:1)

我会试一试,它应该看起来像这样

$(document).ready(function () {
    $(".pr-endorse").click(function () {

        var self        = this
        var productId   = self.id;
        var confId      = $("#ConfectioneryId").val();
        var countNumber = $(this).find(".pr-likes").html();

        $.ajax({
            type : "POST",
            url  : '<%: Url.Action("Endorsement","Confectionery")%>',
            data : {
                productId : productId,
                itemId    : confId
            },
            dataType : 'json',
            success : function (result) {

                $(self).find(".pr-likes").text(result.endoresCount);
                alert(result.endoresCount);

            },
            error : function (xhr) {
                alert(xhr);
            }
        });
    });
});

请注意,success函数中的this不是被单击的元素,并且返回一个通常要设置dataType的对象,即使jQuery在标题正确时也会解析它。 / p>

答案 1 :(得分:1)

尝试

$(".pr-endorse").click(function () {
    var el = $(this);
    $.ajax({
        success: function (result) {
            el.find(".pr-likes").text(result.endoresCount);
        }
    });
});

另外,请确保从控制器返回Json(new { endoresCount = count });