Firefoxでリンクを背面タブに開くのを邪魔するwindow.open()

　Firefoxは初期設定ではリンクは「Ctrl＋左クリック」で新しい背面のタブに表示される。

この記事では、Firefox のオプション ウィンドウ における タブ パネル内のすべてのオプション について説明します。タブパネルでは、タブブラウズ 機能に関する設定を行います。
（中略）
リンクを新しいタブで開いたとき、すぐにそのタブに切り替える: Web上のリンクを中ボタンクリック (または Ctrlキーを押しながらマウスの左ボタンをクリック) した場合、リンクは新しいタブに開かれます。そのタブは表示されずに背面のタブに読み込まれます。ページを新しいタブに読み込み前面に表示するには、このオプションにチェックを入れてください。
（設定ウィンドウ - タブパネル | Firefox ヘルプ）

　「リンクを新しいタブで開いたとき、すぐにそのタブに切り替える」のオプションにチェックを入れた場合は、「Shift＋中ボタンクリック」または「Shift＋Ctrl＋左クリック」で新しい背面のタブに表示される。

背面 のタブで開く*　　リンクを Ctrl+左クリック　リンクを中クリック
前面 のタブで開く*　　Ctrl+Shift+左クリック　Shift+ 中クリック
（中略）
* タブ設定パネルでリンクを新しいタブで開いたとき、すぐにそのタブに切り替える設定が有効な場合、タブを前面で開くショートカットと背面で開くショートカットが入れ替わります。
（マウスショートカット | Firefox ヘルプ）

　しかし、この機能が働かないサイトがあり、調べてみるとリンクをJavaScriptの window.open() を使って開くようになっていた。例えば、次のようなソースのリンクでは「Ctrl+左クリック」または「Shift＋Ctrl＋左クリック」で背面のタブに開くことができず、すぐに新しく開いたタブに切り替わってしまう。

<a href="http://www002.upp.so-net.ne.jp/self/" onclick="window.open(this.href);return false;">「Ctrl+左クリック」で前面のタブに開くリンク</a>

• 「Ctrl+左クリック」で背面のタブに開くリンク
• 「Ctrl+左クリック」で前面のタブに開くリンク

　最初に気が付いた時には不便に思いつつも「JavaScriptを使ったリンクはそういうものだろう」と諦めていた。しかし、最近のOutlook.comではテキストメール内のリンクで、ソースに「onclick="window.open()"」が無く、次のような通常のリンクなのに「Ctrl+左クリック」で背面のタブに開くことができなかった。

<a href="http://www002.upp.so-net.ne.jp/self/" target="_blank">「Ctrl+左クリック」で背面のタブに開くリンク</a>

• 「Ctrl+左クリック」で背面のタブに開くリンク

　Firefoxで上のリンクをCtrlキーを押しながらマウスの左ボタンをクリックすると新しい背面のタブに開くはずである。通常の左クリックでは新しいタブを開き、すぐにそのタブに切り替わるはずである。
　しかし、Outlook.comのテキストメールで「Ctrl+左クリック」で背面のタブに開かないトラブルに遭遇し、しばらく悩んだ（参照）。ただし、HTMLメールでは「Ctrl+左クリック」で背面のタブに開くことができた。偶然の発見と試行錯誤の結果、jQueryを使うことで、リンク部分のソースではJavaScriptを利用していないように記述しても、「onclick="window.open()"」を使ったようにできることが分かった（参照）。
　次のリンクは「Ctrl+左クリック」でも「Shift＋Ctrl＋左クリック」でも背面のタブに開くことができない。

• 「Ctrl+左クリック」で前面のタブに開くリンク

　上のリンクのソースは次のように記述してある。

<ul id="test20141121">
<li><a href="http://www002.upp.so-net.ne.jp/self/" title="「Ctrl+左クリック」で前面のタブに開くリンク" target="_blank">「Ctrl+左クリック」で<span style="color:red;font-weight:bold;">前面</span>のタブに開くリンク</a></li>
</ul>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.js"></script>
<script type="text/javascript">
<!--
$('#test20141121 a').on('click',function(){
    window.open(this.href);return false;
});
//-->
</script>

　jQuery の jquery-2.1.1.js を組み込んで、onメソッドというものを使っている。jQueryについては全く使い方が分からないのだが、【.on() | jQuery 1.9 日本語リファレンス | js STUDIO】のデモを参考にさせてもらった。jquery-latest.js にリンクを張らない方が良いよう（参照）なので jquery-2.1.1.js（参照）にリンクを張った。

　Googleで検索しても、私と同じ不具合に遭遇している人を見つけることができなかった。Firefoxの新しいプロファイルを作製してOutlook.comを開いても再現できたので、私のFirefoxの環境のせいではないだろう。一度確認しただけだが、Internet Explorer では同じ不具合は生じなかった。Firefoxの仕様の問題なのかもしれない。少し前まではOutlook.comのテキストメールを「Ctrl+左クリック」したら背面のタブに開いたのだが、Firefoxのアップデートの時期と重なったため、Firefoxの仕様変更による不具合か、Outlook.comに仕様変更があったのか不明のままである。
　ちなみに、上のソースを次のように変更すると、「Ctrl+左クリック」で背面のタブに開いた。

<script type="text/javascript" src="http://code.jquery.com/jquery-2.1.1.js"></script>
<script type="text/javascript">
<!--
$('#test20141121_2 a').on('click',function(){
    window.open(this.href);return false;
});
//-->
</script>
<ul id="test20141121_2">
<li><a href="http://www002.upp.so-net.ne.jp/self/" title="「Ctrl+左クリック」で背面のタブに開くリンク" target="_blank">「Ctrl+左クリック」で<span style="color:red;font-weight:bold;">背面</span>のタブに開くリンク</a></li>
</ul>

　scriptタグの位置を変えただけである。次のリンクで確認できる。

• 「Ctrl+左クリック」で背面のタブに開くリンク

　onメソッドの後のリンクのソースに「target="_blank"」があると、そちらが優先されて、onメソッドが無視されるのかもしれない。

　最近のWebページはJavaScriptを多用しているような印象で、高スペックのPCでないとブラウザが重くなり表示が遅くなっているような気がして不満だったのだが、まさか「target="_blank"」で十分なリンクにまでJavaScriptを使うとは思わなかった。もしかしたらブラウザによって「target="_blank"」の動作が異なるのでJavaScriptのonメソッドを追加したのかもしれないが、その結果、Firefoxに備わっている便利な機能が殺されてしまった。残念である。

タグ：不具合 JavaScript jQuery