ホームページ >ウェブフロントエンド >jsチュートリアル >クリックイベントで関数呼び出しを切り替えるにはどうすればよいですか?

クリックイベントで関数呼び出しを切り替えるにはどうすればよいですか?

Mary-Kate Olsen
Mary-Kate Olsenオリジナル
2024-11-08 16:31:02368ブラウズ

How to Alternate Function Calls on Click Events?

クリック イベントによる交互の関数呼び出し

質問:

要素がクリックされたときに異なる関数を実行するにはどうすればよいですか?連続するたびにそれらの間で交互にclick?

答え:

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 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。