【JavaScript】要素クリックをトリガーにしたイベント

2019年6月12日JavaScript,イベント

要素クリックをトリガーにしたJavaScriptイベントの実装

JavaScript・jQueryそれぞれ、functionとアロー関数版のサンプルコードです

動作サンプル

動作サンプルではクリック数を表示しています

See the Pen JavaScript click ivent by yochans (@yochans) on CodePen.

JavaScriptでのサンプルコード

HTML

<div id="item"></div>

JavaScript(function)

const target = document.getElementById('target');
let count = 0;

target.addEventListener('click',function() {
  //処理
 }, false);

JavaScript(アロー関数)

const target = document.getElementById('target');
let count = 0;

target.addEventListener('click', () => {
  //処理
}, false);

jQueryでのサンプルコード

HTML

<div id="item"></div>

jQuery(function)

$('#target').click(function() {
        //処理
 });

jQuery(アロー関数)

$('#target').click(() => {
        //処理
 });

参考:【jQuery】要素にクリックイベントを実装する方法 | ONE NOTE

2019年6月12日JavaScript,イベント

Posted by Yousuke.U