使用find（）和children（）时返回空数组的JQuery

我最近在jQuery中遇到了一些关于遍历的问题。我们有一个web应用程序，有多个面板，每个面板都有一个标题和一个正文。在标题中，有一个按钮用于展开/折叠面板主体。面板的设置与此类似：

<div id="panel-1" class="panel">
  <div class="panel-header>
      <span>Header Text</span>
      <div class="toggle-expansion"></div>
  </div>
  <div class="panel-body">...</div>
  <div class="panel-footer">...</div>
</div>

<div id="panel-2" class="panel"> ... </div> 
...

panel

变量被设置为整个面板，这是我所期望的，但是

panelBody

和

toggleButton

为空。在Chrome调试器中，我能够确认

面板

包含了我按下的任何按钮的正确面板，并且我可以看到其他变量是空数组。在调试器中，我可以查看

面板

的数组，该数组包含它的子级，其中包括面板主体和标题（其中包含按钮）

是否有明显的事情我做错了或没有做？我对Javascript和jQuery还比较陌生，所以完全有可能我搞乱了一些基本步骤。任何帮助都将不胜感激

---

我还可以确认css是正确的，因为我在其他地方制作了两个按钮来展开/折叠所有面板，并且我使用

$（“.panel body”）

选择了面板主体。然而，对于这个问题，我只关心被按下的相应按钮的面板

EDIT：我现在看到您正在使用主干网。查看，您可以看到

这是主干视图，而不是DOM元素。要获取jQuery元素，必须使用链接中代码中的
this.$
，而不是
$（this）

EIDT2：对于未来的读者来说，这是个问题，但不是确切的解决方案。OP能够（如评论中所述）替换以下内容：

var panel = $(this);

为此：

var panel = this.$el;

一切都是这样

(this).$element 

在jQuery函数中，
this
通常指的是您正在处理的实际DOM元素，而
$（this）
返回包装该元素的jQuery对象

下面是一个示例代码

this.$('#clientsTable')
    .closest('.dataTables_wrapper')
    .find("div.toolbar")
    .html('<div class="table-tools-actions"><button class="btn btn-primary" id="addSelectedClients" onClick = addAllSelectedMembers()>' + "Add" + '</button></div>');

this.$（“#clientsTable”）
.closest（'.dataTables_包装器'）
.find（“div.toolbar”）
.html（“+”添加“+”）；

上面的代码获取我的表，在我的例子中是clientsTable，搜索类dataTables\u wrapper，然后附加我的HTML代码块
你绝对确定
panel
是实际的面板吗？我希望它是被单击的元素，或者，
，它显然没有子元素或子元素。
console.log（this.className）
给了你什么？@Kevin B起初我也希望它是
，但调试器显示
面板
被设置为面板
console.log（this.className）
返回
undefined
，但是在调试器的“监视表达式”选项卡中，它报告
panel:e.fn.e.init[1]
，并且该数组的第一个元素具有
el:div#panel-1.panel
this.className不应该是未定义的。这个给你什么？问题与.查找或.儿童无关。你能看到你所看到的东西的唯一方法是，如果
这个
不是你所期望的，或者没有你所认为的后代。
console.log（this.id）
也返回未定义的。这个[0].id给你什么？可能插件写得不正确
this
不应该是jQuery对象。$（this）.最近的（.panel”）.children（.panel body“.panel”）有很多方法可以实现，我只是想展示最具语义的一种。我尝试了这两种方法，并且
panel
被设置为空数组以及其他变量。我原本以为
$（this）
将是切换扩展上的div，但它显然不是。那么一定有一些东西你没有向我们展示。该事件是如何绑定到对象的？我不太清楚Backbone.js是如何工作的，但我的工作理解是，每当使用类
切换扩展
在某个对象上发生单击事件时，它就会在名为
切换扩展
的文件中查找一个函数，然后执行它。函数被正确调用，并在正确的时间执行。
this.$('#clientsTable')
    .closest('.dataTables_wrapper')
    .find("div.toolbar")
    .html('<div class="table-tools-actions"><button class="btn btn-primary" id="addSelectedClients" onClick = addAllSelectedMembers()>' + "Add" + '</button></div>');