Question

我需要一些帮助来了解如何实现可以更灵活地使用的函数。说我有这个HTML：

<h3 class="heading">Heading</h3>
<ul class="links">
  <li><a href="#">Link</a></li>
  <li><a href="#">Link</a></li>
  <li><a href="#">Link</a></li>
  <li><a href="#">Link</a></li>
  <li><a href="#">Link</a></li>
</ul>

- 和这个脚本：

$('.heading').click(function() {
    $(this).next().slideToggle();
});

它按预期工作，但我想使函数更通用，因此它可以在其他上下文中使用 - 类似这样：

$('.heading').click(function() {
  collapse();
});
var collapse = function() {
  $(this).next().slideToggle();
}

这显然不起作用，因为$(this)未定义。但是我怎样才能实现类似的目标呢？ Fiddle

Answer 1

你也需要传递元素的对象：

$('.heading').click(function() {
   collapse(this);
});
var collapse = function(_obj) {
 $(_obj).next().slideToggle();
}

<强> Working Demo

jQuery强调如何在函数中使用上下文

1 个答案: