JavaScriptのlocation.hrefでリンクを別窓で開くようにしたらあるブラウザで開かなかった

こんにちは、モトです。

今回JavaScriptでリンクを別窓で開く必要があり、調べて実装してみましたが、
スマホのLINEアプリのブラウザでは開かず失敗してしまったことを書きます。

今回やりたかったことは、

要素をクリックした時に、同じページ内にあるリンクを別窓で開く。

aタグで同じリンクを貼ってtarget=”_blank”をつければ簡単なのでは?と思いますが、
今回はリンクがJSで後から付与されたものでしたので、JSで実装する必要がありました。
普段使わなかったのでネットで調べ、下記の方法を選択しました。

$(".link1").on("click", function() {

let href=$(".link2 a").attr("href");

window.open().location.href=href;

});

単純にlink1をクリックした時、link2のURLを取得し、そのリンクを別窓で表示させる、というものです。

しかし、こちらの方法では他のブラウザでは問題ありませんでしたが、
スマホのLINEアプリでは「about://(null)」と表示され、リンク先を表示することができませんでした。

検証環境
iphone8 iOS 11.4
LINEアプリ 8.5.2

$(".link1").on("click", function() {

let href=$(".link2 a").attr("href");

window.open(href, "_blank");

});

検証の結果、上記の方法にすると無事表示されました!
調べてみますと上記が一般的な方法のようです。

Writer

モト

モト

北海道出身のフロントエンドエンジニア兼登山部部長です。
趣味は登山とアニメです。
お金が登山グッズで消えていきます。
恋人大募集中です。

Contact

ご提案依頼、ご相談、お見積もりなど
お気軽にお問合わせください。

03-6303-9671

平日 10:00~19:00

「Web制作について」とお伝え頂ければ
担当者に取次させていただきます。

Mailform

contact@trym.jp
でも受け付けております。