2

下記コードで、HTMLのリンクを左クリックするとJavaScriptが実行されるのに、リンクを右クリックしてから新しいタブで開くとJavaScriptが実行されないのはなぜ?

  function hoge(a,d){
  var form = document.createElement('form');
  document.body.appendChild(form);
  var input = document.createElement('input');
  input.setAttribute('type','hidden');
  input.setAttribute('name','hogeid');
  input.setAttribute('value',d);
  form.appendChild(input);
  form.setAttribute('action',a+'/q');
  form.setAttribute('method', 'post');
  form.submit();
}
</script>
<a href="#" onclick="hoge('','12345')">12345</a>

実行前のURL
/q

HTMLのリンクを左クリックすると
URLは「/q#」へ一瞬変わった後、「/r」へ変わります。

HTMLのリンクを右クリックしてから新しいタブで開くと
URLは「/q#」となり、画面が切り替わりません。

3 件の回答 3

4

クリックイベントが発火しない理由は既存の回答の通りと思います。

なお、主ボタン以外のクリックはauxclickイベントで、メニューを開く操作はcontextmenuイベントで捕捉できます。

link.addEventListener("click", showEvent)
link.addEventListener("auxclick", showEvent)
link.addEventListener("contextmenu", showEvent)

function showEvent(event) {
  console.log(`${event.type}: ${event.button}`)

  if (event.type == "click") {
    event.preventDefault()
  }
}
<a id="link" href="/">クリック</a>

ただし、コンテキストメニュー上で項目を選択する際のクリックは、ブラウザがドキュメントとは別に表示したUI上で起ったことなので、捕捉する方法は無いと思います。つまり、ユーザーがリンクのURLを調べて、それを新しいタブのアドレス欄に入力して訪問するのと変らないはずです。

2

右クリックはあくまでコンテキストメニューを呼び出すボタンなので、ここから実行する「新しいタブで開く」は「(リンク上での) 左クリック」とは等価にならないと思います。

参考:
Is right click a Javascript event? の回答の一つ

Ya, though w3c says the right click can be detected by the click event, onClick is not triggered through right click in usual browsers.

In fact, right click only trigger onMouseDown onMouseUp and onContextMenu.

Thus, you can regard "onContextMenu" as the right click event. It's an HTML5.0 standard.

2

右クリックで click イベントは発生しません。

https://www.w3.org/TR/uievents/#event-type-click

The click event should only be fired for the primary pointer button (i.e., when button value is 0, buttons value is 1). Secondary buttons (like the middle or right button on a standard mouse) MUST NOT fire click events. See auxclick for a corresponding event that is associated with the non-primary buttons.

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。