ボタンで他ページに移動する

HTML

他ページへ移動する場合は通常<a href="{URL}">〜</a>を使ったリンクを使用しますが、ボタンを使って他ページに移動させたいという場合もあります。ここではボタンで他ページに移動させる方法について解説します。

同じタブでページ移動

同じタブでページ移動をおこなう場合は、onclick="location.href='{URL}'"をinputタグやbuttonタグに追加します。URLは絶対URL・相対URLどちらでも指定することができます。

input

<input type="button" onclick="location.href='./hoge.html'" value="ボタン">

button

<button onclick="location.href='./hoge.html'">ボタン</button>

ページ移動を別タブで開きたい場合は、onclick="window.open('test.htm')"をinputタグやbuttonタグに追加します。URLは絶対URL・相対URLどちらでも指定することができます。

input

<input type="button" onclick="window.open('./hoge.html')" value="ボタン">

button

<button onclick="window.open('test.htm')">ボタン</button>