HTMLのformで相対パスを直接入力したい

HTMLのformで、例えば

/hoge/huga

というパスがあったとして、このパスを直接入力してページ遷移できるフォームがサクッとできたら便利だなぁと思っていますが、思ったような実装方法が出てきません。

用途としては、Railsアプリで（ルーティングはしているけど）まだリンクを作成していないページにサクッと飛べたら、という感じを想定しています。

別にerbでもJSでもいいんですが、シンプルな実装法だと未経験の方にもシェアしやすいですし、むしろHTMLで完結しないのがなんだか悔しいです。笑

ご教示いただけますと幸いです。
よろしくお願いいたします。

y_waiwai

2018/09/02 06:11

質問が意味不明です。なにをしたいのか、なにを聞きたいのかもうちょっと具体的に説明しましょう

takumiabe

2018/09/03 04:42

デバッグ用途で、 <form action="[URL]"> ... </form> の[URL]の部分を手打ちして、テストしたい、という話でしょうか。それとも、 http://localhost:3000/rails/info/routes のような画面のイメージでしょうか？

capybara1229

2018/09/03 07:29

分かりづらいようでご迷惑をおかけしました。takumiabeさんのおっしゃる一番目の内容を想定しています。

x_x

2018/09/11 01:04

例は相対パスではなく絶対パスですよね。どうしたいのでしょうか？

行動規範の内容に同意します

回答1件

ベストアンサー

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4	<meta charset="UTF-8">
5	<title>Document</title>
6</head>
7<body>
8	<form id="js__form">
9		<input type="text" id="js__path" placeholder="パスを入力"><input type="button" id="js__go" value="Go">
10	</form>
11
12	<script>
13		let transitionPage = function transitionPage(){
14			let path = document.getElementById("js__path").value;
15
16			let a  = document.createElement("a");
17			a.href = path;
18			let e  = document.createEvent("MouseEvents");
19			e.initEvent("click", false, true);
20
21			a.dispatchEvent(e);
22		}
23		
24		document.getElementById("js__form").addEventListener("submit", function(event){
25			transitionPage();
26
27			event.preventDefault();
28		});
29		document.getElementById("js__go").addEventListener("click", function(event){
30			transitionPage();
31		});
32
33	</script>
34</body>
35</html>