JavaScriptのform.targetとは？送信結果を表示するウィンドウ・フレームを指定する方法
form.target は、フォーム送信後の結果をどのウィンドウ（またはフレーム）に表示するかを指定するプロパティです。
HTML の target="" と同じ役割を持ち、JavaScript を使うことで動的に切り替えることもできます。
targetプロパティとは？
target は、フォーム送信後の表示先を指定するプロパティです。
_self：現在のウィンドウに表示（デフォルト）_blank：新しいウィンドウ（タブ）で開く_parent：親フレームに表示_top：最上位フレームに表示- 任意のウィンドウ名・フレーム名を指定することも可能
JavaScript を使えば、ユーザーの選択に応じて target を切り替えることができます。
使用例：選択内容に応じて target を変更する
以下の例では、ラジオボタンで「感想」か「質問」を選ぶと、送信先ページだけでなく、表示先ウィンドウ（target）も切り替わります。
<head>
<title>JavaScript Sample</title>
<script>
function sendForm() {
const formElem = document.getElementById(“form1”);
// 「感想」が選択された場合
if (formElem.radio1[0].checked) {
if (!confirm(“送信内容はご感想でよろしいですか？”)) return false;
formElem.action = “impression.html”;
formElem.target = “_blank”; // 新しいタブで開く
}
// 「質問」が選択された場合
if (formElem.radio1[1].checked) {
if (!confirm(“送信内容はご質問でよろしいですか？”)) return false;
formElem.action = “question.html”;
formElem.target = “_self”; // 同じ画面に表示
}
}
</script>
</head>
<body>
<form id=”form1″ onsubmit=”return sendForm()”>
<p>
<input type=”radio” name=”radio1″ checked> 感想
<input type=”radio” name=”radio1″> 質問
</p>
<p><textarea name=”text” cols=”30″ rows=”5″></textarea></p>
<p>
<input type=”submit” value=”送信”>
<input type=”reset” value=”クリア”>
</p>
</form>
</body>
</html>
→ form.target を使うと、送信結果をどこに表示するか自由に制御できます。
送信先ページの例
question.html
impression.html
まとめ
form.targetは送信結果を表示するウィンドウ・フレームを指定するプロパティ_self・_blankなどの特殊ターゲットが利用可能- JavaScript を使えば target を動的に変更できる
- フォームの動作を柔軟に制御できるため実務でも役立つ
