イベントソースオブジェクトを取得するjqueryメソッド

JQuery ではイベントソースオブジェクトを簡単に取得できます。イベントハンドリング関数では、イベントオブジェクト(event)を渡すことでイベントソースオブジェクトを取得できます。さらに、JQuery は、event.target というイベント ソース オブジェクトを取得する関数も提供します。

event.target と this の違い

イベント処理関数では、イベント ソース オブジェクトを参照するために this を使用することがよくあります。また、event.target はイベント ソースを取得するためにも使用できます。物体。それらの違いは、これはイベント ハンドラーが現在バインドされている要素を指すのに対し、event.target はイベントの実際のターゲット要素を指すことです。

例:

HTML コード:

<div>
  <p>这是一个段落</p>
  <button>点击我</button>
</div>

JavaScript コード:

$("div").on("click", function(event) {
  console.log("this:", this);  // 输出<div>元素
  console.log("event.target:", event.target);  // 点击<div>输出<div>元素，点击<p>输出<p>元素，点击<button>输出<button>元素
});

event.target の使用法

上記の例では、event.target を使用してイベント ソース オブジェクトを取得するほかに、JQuery が提供する関数を使用してイベント ソース オブジェクトを取得することもできます。 JQueryではevent.targetのカプセル化関数$(event.target)を提供しており、イベントソースオブジェクトを簡単に取得できます。

例:

$("div").on("click", "button", function(event) {
  var $button = $(event.target);  // 获取被点击的<button>元素
  console.log($button.text());  // 输出"点击我"
});

この例では、ボタンをクリックすると、$(event.target) を通じてクリックされたボタン オブジェクトを取得できます。その後、ボタンのテキストの取得など、このオブジェクトに対していくつかの操作を実行できます。

まとめ

イベントソースオブジェクトはJQuery経由で取得するのが非常に便利で、event.targetやthisを利用して取得することができます。イベントを処理するとき、特定の状況に応じてイベント ソース オブジェクトを取得する適切なメソッドを選択すると、コードがより簡潔で読みやすくなります。

以上がイベントソースオブジェクトを取得するjqueryメソッドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。