我的问题是为什么我不能使用$(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
答案 0 :(得分:0)
这是因为你对.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);
});
答案 1 :(得分:0)
来自我正在使用的功能。我必须使用普通功能,它工作正常,感谢帮助人员。
$(this)
无法使用该功能()=>{}