JavaScriptから新しいタブで開く方法【現役エンジニアが解説】
今回は、JavaScriptから新しいタブで開く方法について、フォーム送信の有無に分け、簡単に解説していきます。
新しいタブで開く方法
JavaScriptから新しいタブで開く方法は簡単です。
windowインターフェースのopen()メソッドを使うだけです。
window.open('https://www.google.com/');
上記コードのように、open()メソッドの第一引数には開きたいURLを指定します。
新しいタブでフォーム送信する方法
新しいタブでフォーム送信する場合には、別の方法となります。
フォームを作成したうえで、そのフォームのtarget属性の値を”_blank”とします。
// フォームを作成(JavaScriptで作成の場合) var form = document.createElement("form"); var input = document.createElement("input"); input.name="input_name"; input.value="input_value"; form.appendChild(input); form.action = "https://www.google.com/"; form.method = "POST"; // フォームを指定(HTMLで作成の場合) // var form = document.getElementById("form"); // 新しいタブでフォーム送信 form.target = "_blank"; form.submit();
上記のコードでは、JavaScriptからフォームを作成し、新しいタブでフォーム送信しています。
JavaScriptから開いたタブを閉じる方法
JavaScriptから開いたタブはJavaScriptで閉じることもできます。
そのためには、windowインターフェースのopen()メソッドの返り値に対し、close()メソッドを使います。
window.open('', '_self').close();
上記のコードのように、open()メソッドの第二引数を”_self”とすることで、自分自身のウィンドウ(タブ)を指定することができます。