web-dev-qa-db-ja.com

HTMLボタンをハイパーリンクのように動作させるにはどうすればよいですか？

HTMLボタンをハイパーリンクのように動作させるにはどうすればよいですか。クリックすると、目的のページを表示するブラウザーウィンドウが開きます。

私はこれだけ理解しています。私はこれを使用すると思いますが、 "onclick"の引用符内のいくつかのJavaScriptコードへのリンクの代わりに、新しいブラウザウィンドウを起動する単純なものを配置したいと思います。

javascripthtmlonclick
16
xarzu

onclickおよびwindow.open

<input type="button" onclick="window.open('http://www.example.com','_blank','resizable=yes')" />
25
YOU
In Head:  
<script>
openNewWindow = function()
{
 window.open(url, "_blank");
};
</script>
In Body:    
<input type="button" onclick="openNewWindow()" >

入力タグにコードを置くのではなく、openNewWindow（）という名前の関数を定義することを好みます。これは組織用です。さまざまなウィンドウを開くためのさまざまなボタンを用意する予定がある場合は、これを行うことを強くお勧めします。

9
Warty

これはあなたにとって最良の解決策だと思います。

これを試してください

<a href="http://www.stackoverlfow.com" target="_"><input 
type="button" value="Click Me"/></a>

ハッピーコーディング!!

9
Ravia

あなたはこのようなことをすることができます：

window.open(url, "window-name", "menubar=no,innerWidth=600,innerHeight=600,toolbar=no,location=no,screenX=400,screenY=40");

名前をopenメソッドに渡すと、ブラウザが新しいウィンドウを開きます。 3番目の引数は、新しいウィンドウの外観を定義します。

2
Kees de Kooter
<input type="button" value="Google"
       onclick="window.open('http://www.google.com', '_blank');" />
2
Josh Stodola

私は7年遅れだと思いますが、同様の問題があり、フォローしてくれる人にコメントしたいと思いました。

Bootstrapを使用している場合は、Bootstrapボタンのクラス名を付けてタグをアンカーし、ボタンのように見せることができます。

<a href="path/file.ext" class="btn btn-md btn-link">I Look Like A Button</a>

ブートストラップは、btn-smまたはbtn-lgを含む基本サイズもサポートします。確かに、すべての人がBootstrapを使用しているわけではありませんが、それでもデフォルトのスタイルは無料で見つけやすく、カスタムのボイラープレートレイアウトを使用している場合でも、独自のスタイルシートにコピーできます。

1
RalphTheWonderLlama