$（this）在if（$（“.element”）.is（）中不起作用

Question

我对以下代码的预期结果是.csr区域-3.csr视频添加了类csr动画csr放大，为什么$（本）在这种情况下不工作？

if（$（“.csr-area-3.csr-video”）.is（“：in-viewport”））{$（this）.addClass（'csr-animate csr-zoom-in'）；}

Answer 1

因为上下文是调用方函数/事件，或者可能是全局窗口上下文，所以再次使用相同的选择器来添加类：

if（$（“.csr-area-3.csr-video”）.is（“：在视口中”）{$（“.csr-area-3.csr-video”）.addClass（'csr-animate csr-zoom-in'）；}

---

根据评论编辑

使用变量存储jquery查找的结果：

var csrvideo=$（“.csr-area-3.csr-video”）；if（csrvideo.is（“：in-viewport”））{csrvideo.addClass（'csr-animate csr-zoom-in'）；}

注：使用filter作为@saptal的答案可以确保在存在多个元素的情况下将类添加到viewport中的元素中。

Answer 2

你需要.filter（函数），以获取视图端口中匹配的元素，然后将类添加到

$（“.csr-area-3.csr-video”）.filter（函数（）{return$（this）.is（“：in-viewport”）；}).addClass（'csr-animate csr-zoom-in'）；

你也可以使用

$（“.csr-area-3.csr-video:in-viewport”）.addClass（'csr-animate csr-zoom-in'）；

Answer 3

如果你只使用

$（this）.someFunction（）；

这指的是窗口对象。

你需要这样做

$（“.csr-area-3:in-viewport”）.addClass（'csr-animate csr-zoom-in'）；$（“.csr-video:in-viewport”）.addClass（'csr-animate csr-zoom-in'）；

（取决于您实际想要什么）