jQueryのイベントオブジェクトevent

さて、jQueryのイベントについて学び始めましょう。

jQueryでイベントが発生すると、イベントに関するすべての情報を含む イベントオブジェクト event が生成され、このオブジェクトはハンドラー関数に渡されます。

例えば、どのタグをクリックしたのかを知ってみましょう。 次のHTMLコードを使用します:

html<body>
  <div id="text"></div>
  <div>
    <p>
      <strong><span>click</span></strong>
    </p>
  </div>
</body>

CSSは以下のようになります:

cssspan, strong, p {
  display: block;
  padding: 10px;
  border: 1px solid black;
}

次に、メソッド clickのハンドラー関数に渡すオブジェクト eventのプロパティ event.target.nodeNameを利用してみましょう:

javascript$('body').click(function(event) {
  $('#text').html('clicked: ' + event.target.nodeName);
});

オブジェクト eventは多くのプロパティとメソッドを含んでいます。

event