Javascript 每个元素一次Jquery触发函数

因此，我有一个包含一些内容的小表，只需单击一个按钮，它就可以展开，以显示包含额外内容的容器div

我试图将一个函数绑定到此操作，但当我绑定时，该函数似乎会在每个表行中触发一次

JSFiddle：

表:

<button id="toggle-descriptions-button">+</button>

<table>
  <tbody>
    <tr>
      <th class="table-header-1">Download</th>
      <th class="table-header-2">Size</th>
      <th class="table-header-3">Notes</th>
    </tr>
    <tr>
        <td class="column-1">Item
            <div class="div-container" style="display: block;">
                <div class="div-gallery">
                    <img src="#">
                    <br style="clear: both">
                </div>
                <div class="div-description">Description Text</div>
            </div>
        </td>
      <td class="column-2">1.2MB</td>
      <td class="column-3">Note</td>
    </tr>
  </tbody>
</table>

如您所见，它调用函数22次，我试图让它只调用一次

---

我希望得到函数的一次回调，所有描述都是一次状态更改，我只需要一次返回。

要实现这一点，您可以使用

toggle（）

调用返回的

promise（）

。将

done（）

事件处理程序附加到它，它将在解决所有承诺后触发：

var$descriptions=$（“.div容器”）
var$descButton=$（“#切换描述按钮”）
$descButton.单击（函数（）{
log（“单击按钮！”）
$descriptions.toggle（400.promise（）.done（function（））{
log（“我是一个函数！”）
});
});

+
下载
大小
笔记
项目


描述文本
1.2MB
注
项目


描述文本
1.2MB
注
项目


描述文本
1.2MB
注
@Rorymcrossan是的。我误解了这个问题。哈！太棒了，这正是我想要的。谢谢你指出这一点！
var descriptions = $(".div-container")
var descButton = $("#toggle-descriptions-button")

descButton.click(function(){
    console.log("Button Clicked!")
    descriptions.toggle(400, function() {
        console.log("I'm a fucntion!")
    });
});