Jquery $(this) 在函数内部不起作用
Jquery $(this) not working inside function
我正在尝试使用 waypoints.js 在滚动点击元素时使元素淡入。
我有
$(document).ready(function(){
$('.card').waypoint(function(down) {
console.log('hit element');
$(this).addClass('card-fadeIn');
}, { offset: '100%' });
});
这样做的目的是添加 class 'card-fadeIn' 不透明度 1 和动画效果。
当我把它改成
$('.card').addClass('card-fadeIn');
它工作正常,但为每张卡片添加不透明度 1 class 并破坏淡入效果。我试图改用 $(this) 但它不会淡入,也不会在控制台中给出错误。有什么想法吗?
你必须使用
$(this.element)
在 Waypoint 处理程序中。所以,
$(this.element).addClass('card-fadeIn');
应该做你想做的。
$(this)
在 jQuery 回调中工作,因为 jQuery 是为以这种方式工作而设计的。然而,它并没有什么神奇之处,所以如果 this
没有引用 DOM 元素,你将得到一个 jQuery 对象,它不会做任何事情(而且它不会不要报告任何错误,因为,再一次,这就是 jQuery 的工作方式)。 Waypoint 库将 this
绑定到它自己的上下文对象,并公开对回调中涉及的 DOM 元素的引用作为 "element" 属性.
你试过了吗this.element?
$(document).ready(function(){
$('.card').waypoint(function(down) {
console.log('hit element');
$(this.element).addClass('card-fadeIn');
}, { offset: '100%' });
});
我正在尝试使用 waypoints.js 在滚动点击元素时使元素淡入。
我有
$(document).ready(function(){
$('.card').waypoint(function(down) {
console.log('hit element');
$(this).addClass('card-fadeIn');
}, { offset: '100%' });
});
这样做的目的是添加 class 'card-fadeIn' 不透明度 1 和动画效果。
当我把它改成
$('.card').addClass('card-fadeIn');
它工作正常,但为每张卡片添加不透明度 1 class 并破坏淡入效果。我试图改用 $(this) 但它不会淡入,也不会在控制台中给出错误。有什么想法吗?
你必须使用
$(this.element)
在 Waypoint 处理程序中。所以,
$(this.element).addClass('card-fadeIn');
应该做你想做的。
$(this)
在 jQuery 回调中工作,因为 jQuery 是为以这种方式工作而设计的。然而,它并没有什么神奇之处,所以如果 this
没有引用 DOM 元素,你将得到一个 jQuery 对象,它不会做任何事情(而且它不会不要报告任何错误,因为,再一次,这就是 jQuery 的工作方式)。 Waypoint 库将 this
绑定到它自己的上下文对象,并公开对回调中涉及的 DOM 元素的引用作为 "element" 属性.
你试过了吗this.element?
$(document).ready(function(){
$('.card').waypoint(function(down) {
console.log('hit element');
$(this.element).addClass('card-fadeIn');
}, { offset: '100%' });
});