如何在点击事件上交替调用函数？

通过点击事件交替调用函数

问题：

单击元素时如何执行不同的函数，每次连续单击时在它们之间交替？

答案：

jQuery 提供了专为此目的而设计的 .toggle() 方法的替代版本，尽管此后它已经已被弃用。还有其他方法，例如创建提供所需功能的自定义插件。

使用已弃用的 .toggle() 方法：

$('#element').toggle(function() {
  // Function 1
}, function() {
  // Function 2
});

自定义插件：

(function($) {
  $.fn.clickToggle = function(func1, func2) {
    var funcs = [func1, func2];
    this.data('toggleclicked', 0);
    this.click(function() {
      var data = $(this).data();
      var tc = data.toggleclicked;
      $.proxy(funcs[tc], this)();
      data.toggleclicked = (tc + 1) % 2;
    });
    return this;
  };
}(jQuery));

$('#element').clickToggle(function() {
  // Function 1
}, function() {
  // Function 2
});

备注：

• 自定义插件可用于任何事件，而不仅仅是点击。
• 它接受任意数量的函数交替执行。
• 已弃用的 .toggle() 方法可能会在复杂场景中导致性能问题。

以上是如何在点击事件上交替调用函数？的详细内容。更多信息请关注PHP中文网其他相关文章！