【HTML】ボタン(button)にリンクを設定する方法

HTMLではリンクを設定するときに

<a href="ここにリンク">
</a>

上記のように記載するので、ボタンにリンクを設定するときは

<a href="ここにリンク">
    <button type="button">送信</button>
</a>

上記のように書いてしまいがち。

でもこれは間違いで、下記のように書くのが正解。

<input type="button" onclick="location.href='ここにリンク'" value="遷移">

※リンクを '（シングルクォーテーション）で囲むのも忘れないように！

なぜ<a>タグではダメなのかというと

HTMLの規定を定める【W3C】の仕様に

<a>タグの中にインタラクティブコンテンツを入れてはいけない！

という仕様があるため。

※インタラクティブコンテンツ・・・select, button, a, input, textarea など

もし<a>タグを使って書いてしまった場合は

IE(インターネットエクスプローラー)で動作しない可能性がある。

なので要注意！！！

余談だが、ボタンに前の画面に戻る場合の設定をしたいときは

<input type="button" onclick="history.back()" value="戻る">

上記のように書くと前のページに戻ることができる。