【GTM】onclickとGTMのリンククリックリスナーの干渉(リンククリックリスナーが正常に動かない場合)

GTMのリンククリックリスナーはとても便利ですが、onclickが最初から仕込まれていて且つそのソースをいじることが出来ない場合だったり、似たようなリスナーが他に存在していたりすることでGTMのリンククリックリスナーが正常に動かない場合があります。

aタグにonClickが記述されている場合、aタグに書かれているonclickが先に発火しますが、その後GTM側のリンククリックリスナーが発動しないという状態になります。

一番簡単な解決方法は先に走るonClickのjavascriptに

return false;

または

event.preventDefault();

を記述することです。
この2つは意味合いが異なりますので、必要に応じて使ってください。こちらのブログによると、「return false;」の動きは
jQueryのイベント:
  デフォルト動作を抑止。
  イベントバブリングを中止する。

通常のDOMのイベント: 
  デフォルト動作を抑止。(但しブラウザのバージョンに依存)
  イベントバブリングの中止はしない。
となるようです。

また、リンククリックリスナーの「Check Validation」はOFFにしておく必要があります。



もう少し検証が必要かな?と個人的に感じていますが、現状はこのやり方で正常にonClickとGTMのlinkClick Listenerの両方が動いているようなので、様子を見ます。

このブログの人気の投稿

ウェブサイトユーザビリティ評価のためのSUS(System Usability Scale)

離脱改善指標に関するメモ

[Google Spreadsheet]ある文字列を含むリストを表示させる