Question

在点击ID设置为href的锚标记时，我正在执行ajax请求。顺便说一下，这个锚标签是动态创建的。

<a href="983" class="commentDeleteLink">delete</a>

单击锚标记时，将执行以下代码：

    $('.commentDeleteLink').live('click', function(event) {
        event.preventDefault();
        var result = confirm('Proceed?');

        if ( result ) {
            $.ajax({
                url: window.config.AJAX_REQUEST,
                type: "POST",
                data: { action       : 'DELCOMMENT',
                        comment      : $('#commentText').val(),
                        comment_id   : $(this).attr('href') },
                success: function(result) {
                    alert($(this).attr('href'));
                    //$(this).fadeOut(slow);
                }
            });
        }
    });

当我尝试显示$（this）.attr（＆＃39; href＆＃39;）时，它表示未定义＆＃34;＆＃34;未定义＆＃34;。我真正想做的是fadeOut锚标记，但是当我调查$（this）的值时，它是＆＃34; undefined＆＃34;。

上面的代码段有什么问题？

Answer 1

使用函数内部调用$（this）。这是修复：

$('.commentDeleteLink').live('click', function(event) {
    var myRef = this;

    event.preventDefault();
    var result = confirm('Proceed?');

    if ( result ) {
        $.ajax({
            url: window.config.AJAX_REQUEST,
            type: "POST",
            data: { action       : 'DELCOMMENT',
                    comment      : $('#commentText').val(),
                    comment_id   : $(this).attr('href') },
            success: function(result) {
                alert($(myRef).attr('href'));
                //$(this).fadeOut(slow);
            }
        });
    }
});

Answer 2

你应该试试

$('.commentDeleteLink').live('click', function(event) {
    event.preventDefault();
    var result = confirm('Proceed?');
    var that = this;
    if ( result ) {
        $.ajax({
            url: window.config.AJAX_REQUEST,
            type: "POST",
            data: { action       : 'DELCOMMENT',
                    comment      : $('#commentText').val(),
                    comment_id   : $(this).attr('href') },
            success: function(result) {
                alert($(that).attr('href'));
                //$(that).fadeOut(slow);
            }
        });
    }
});

因为回调中的this不是被点击的元素，您应该将this缓存到您可以重复使用且对上下文不敏感的变量that中

Answer 3

click事件处理程序（this在该处理程序中引用的对象）的上下文不会传播到您的AJAX成功回调。

您可以通过将其分配给局部变量来从调用方捕获this的值，也可以通过将this选项中的context传递给{{3}来显式传播它。 }}：

$.ajax({
    url: window.config.AJAX_REQUEST,
    type: "POST",
    data: {
        action: "DELCOMMENT",
        comment: $("#commentText").val(),
        comment_id: $(this).attr("href")
    },
    context: this,
    success: function(result) {
        $(this).fadeOut("slow");  // Works, since 'this' was propagated here.
    }
});

Answer 4

您处于AJAX功能中，因此如果您想在$(this)使用

，则必须首先将点击功能的$(this)分配给变量

$('.commentDeleteLink').live('click', function(event) {
    ....
    var current = $(this);
    $.ajax({
        // You can use current here
    });
});

Answer 5

功能范围内的范围变更。

缓存链接对象并在ajax请求中引用它。

为什么在ajax调用之后$（this）是未定义的

5 个答案: