jquery next()this

kkbh8khc  于 2023-06-22  发布在  jQuery
关注(0)|答案(2)|浏览(114)

我偶然发现了一个小问题。
想做一个简单的 accordion 导航。jquery,但注意到一些我无法理解的东西。
这是我代码

<div class="box"> Item 1</div>
<div class="text"> Text Box </div>
<div class="box"> Item 2</div>
<div class="text"> Text Box 2</div>
<div class="box"> Item 3</div>
<div class="text"> Text Box 3</div>

JS

$('.box').click(function(){
    $('.text').slideUp()
    $(this).next().slideToggle()    
})

我想知道的是如果我用

$(this).next().slideToggle()
  • 一切正常 *

现在我试着把(这个)替换成如下:

$('.text').next().slideToggle()

但效果是不同的。我想(这)会与div-text相关,或者至少与DOM中的其他东西相关?

yyhrrdl8

yyhrrdl81#

click事件中的$(this)表示事件的来源,另一方面,$('.text')表示所有具有class文本的元素的集合。$('.text').next().slideToggle()将在选择器$('.text')返回的集合的第一个元素上调用slideToggle

wgxvkvu9

wgxvkvu92#

简而言之:

$(this) // <----Represents current target which got the event

同时:

$('.text') // <--- this is a collection of all elems with class '.text' so all
           // -----will be getting events simultaneosly.

相关问题