HTML5で検索フォームを実装

質問

現在HTML5をサイトや本を見ながら勉強中なのですが、
検索窓に数値を入力し、入力された数字に割り当てられた
結果を表示する機能を持ったスマートフォンページを
作りたいと考えています。

例えば…
(1)検索窓に25と入力して検索ボタンを押す
(2)図鑑No.25のピカチュウが検索結果として表示される
という具合です。

<input type="number">を使って簡単に数値の入力フォームが
作れることはわかったのですが、どのように数字と結果を
結びつければいいのかがわかりません。

どんなヒントでも構わないのでどなたかご教授いただけないでしょうか。

よろしくお願いします。

回答No.1

aaooii_33_lloo · ベストアンサー

やり方は色々あると思いますが
JSでやるなら

<form onsubmit="return send( this )">
<input type="number" name="number" value="25"/>
<input type="submit" value="send"/>
</form>

<script>
function send( _this ) {
var num = _this.number.value;

location.href = '25.html';

};
</script>

こんな感じでいかがでしょうか

お礼

ご回答ありがとうございます。
まだ勉強中のためこの記述を見て
「なるほど！」と完全に理解することはできないのですが
全体の大まかな流れはつかめました。
あとは理解できていない記述と命令の関係性を調べて
実装に向けて進んでいきたいと思います。

ありがとうございました！