Question

我的问题是为什么我不能使用$（this）jQuery选择器在ajax加载的内容这里是我的代码：

$('.commentsDiv').css({'opacity': '0'});
        var loadTheComments = $('.commentsDiv').load($homeUrl+'trailer-comments/'+$trailerID,function(){
            $('.targetDiv').hide();
            $('.showSingle').click(function(e){
                e.preventDefault();
                $('#div'+$(this).attr('target')).slideToggle();
            });

            var commentsReplyLink = $('.commentReplyLink');
            commentsReplyLink.click((e)=>{
                e.preventDefault();
                commentsReplyLink.each(()=>{
                    var $self = $(this);
                    var $addedBy = $self.attr('data-value');
                    var $commentID = $self.attr('data-id');


                    $('html,body').animate({
                        scrollTop: $(".post-comment-form").offset().top},
                        'slow');

                    $('#commentReplyDiv').css({
                        display: 'block',
                    });

                    console.log('added by: '+$addedBy+' comment id: '+$commentID);

                    $('#replyToCommentInput').val($addedBy);
                    $('#replyToCommentInput').attr('comment-id', $commentID);
                });
            });
        }).animate({opacity:'1'}, 3500, () => {});

我试图从看起来像这样的超链接中获取comment-id属性：

<a class="commentReplyLink" data-id="14" data-value="Reply to #14" href=""><em>Reply</em></a>

但是当点击该超级链接时，我在Console.log（）..：

中获取此信息

added by: undefined comment id: undefined

Answer 1

这是因为你对.each()回调使用了“箭头函数”，箭头函数没有绑定this标识符，所以它使用的是外部作用域中定义的最近的标识符。

而是使用函数参数。

commentsReplyLink.each((i, link)=>{
    var $self = $(link);

虽然看起来好像你只想点击一下。如果是这样，您不需要循环。使用事件对象的.currentTarget属性。

$('.commentReplyLink').click((e)=>{
    e.preventDefault();
    var $self = $(e.currentTarget);
    var $addedBy = $self.attr('data-value');
    var $commentID = $self.attr('data-id');


    $('html,body').animate({
        scrollTop: $(".post-comment-form").offset().top},
        'slow');

    $('#commentReplyDiv').css({
        display: 'block',
    });

    console.log('added by: '+$addedBy+' comment id: '+$commentID);

    $('#replyToCommentInput').val($addedBy);
    $('#replyToCommentInput').attr('comment-id', $commentID);
});

Answer 2

来自我正在使用的功能。我必须使用普通功能，它工作正常，感谢帮助人员。

$(this)无法使用该功能()=>{}

为什么我不能使用$（this）jQuery选择器

2 个答案: