• ベストアンサー

ボタンをクリックして、リンクを開きたい

ボタンをクリックして、リンクを開きたいのですが <input type="button" value="yahooを表示する" onClick="location=http://www.yahoo.co.jp/"> をしても何も起りません。 出来れば、新しいブラウザで開きたくて、 <A href="http://www.yahoo.co.jp/" target="HOGE">yahooを表示する</a> と同じように、ボタンをクリックして開きたいので、ご教授お願いします。

  • HTML
  • 回答数2
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.2

サーバーにデータを送信するためのformやinputを使うのは、間違いです。 →14.1 スタイルシートの概説 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )  HTMLを作成する上で、もっとも大事なことです。かっては多く使用されていたため、『Webページはより複雑化し、限られた環境にしか適応しなくなり、相互運用性問題に悩まされることとなり、 ・・・( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )』  ごく普通に、リンクならリンクとしてHTMLを記述して、スタイルシートでそれをどのようにプレゼンテーション(表現)するかを指定すると、『例えば、様々な解像度や色深度のグラフィックディスプレイを持つPCや、携帯電話、モバイル機器、音声入出力機器、帯域が広いコンピュータや狭いコンピュータ、等 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.2.1 )』は、むろん検索エンジンにも理解してもらえるページが作成できます。  参考にされている資料はとても古いもののようです。 <p><a href="http://www.yahoo.co.jp/">Yahoo! JAPAN</a></p> などで、良いですよ。  そしてスタイルシートでデザインを決めていきます。そうすることで 『HTMLにおける制限されたプレゼンテーション機構に取ってかわる。スタイルシートでは、行間の設定やインデントの設定、テキスト色や背景色、フォントのサイズとスタイル、その他様々なプロパティの設定が簡単にできる。 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/styles.html#h-14.1 )』 下記にサンプルを上げておきます。 ★Another HTML-lint 5 ( http://www.htmllint.net/html-lint/htmllint.html# ) ★W3C CSS 検証サービス ( http://jigsaw.w3.org/css-validator/#validate_by_input )  で検証済みの、ウェブ標準HTML4.01strict+CSS2.1です。 ※タブは_に置換してありますから戻してください。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="ja"> <head> _<meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> _<title>サンプル</title> _<meta name="author" content="ORUKA1951"> _<meta http-equiv="Content-Style-Type" content="text/css"> _<link rev="made" href="mailto:oruka1951@hoge.com" title="send a mail" > _<link rel="START" href="../index.html"> _<style type="text/css"> <!-- p.nav a{ _display:block; /* ブロックにして */ _width:12em;line-height:1.6em;/* サイズを決め */ _margin:0 auto; /* 表示位置を決め */ _border:outset 3px gray;/* 枠線のデザインを決め */ _text-align:center;text-decoration:none;/* 文字のデザインを決め */ _color:black;background-color:silver;/*色と背景を決め */ } p.nav a:hover{/*ポインターが乗ったとき */ _background-color:rgb(220,220,220) } p.nav a:active{/* 押されたとき */ _border:inset yellow;background-color:yellow; } --> _</style> </head> <body> _<div class="header"> __<h1>タイトル</h1> __<p>このページでは・・・・</p> _</div> _<div class="section"> __<h2>見出し</h2> __<p class="nav"><a href="http://www.yahoo.co.jp/">Yahoo! JAPAN</a></p> _</div> _<div class="footer"> __<h2>文書情報</h2> __<dl class="documentHistry"> ___<dt id="FIRST-PUBLISHED">First Published</dt> ___<dd>2012-08-10</dd> ___<dt id="LAST-MODIFIED">Last Modified</dt> ___<dd>2012-08-10 12:00:00 (JST)</dd> __</dl> __<address>&copy; ORUKA1951 2012 - 2016 All Rights Reserved mailto:*****</address> _</div> </body> </html>

MRFAGPZ
質問者

お礼

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

その他の回答 (1)

  • torayoshi
  • ベストアンサー率62% (910/1449)
回答No.1

何も起こらない原因→URLをシングルクォーテーションで囲む。 <input type="button" value="yahooを表示する" onClick="location='http://www.yahoo.co.jp/'"> 新しいブラウザで開く(※) <input type="button" value="yahooを表示る" onClick="window.open('http://www.yahoo.co.jp/')"> (※)locationオブジェクトにはtargetに相当するプロパティがないので、    window.openメソッドを使います。    ブラウザの設定により挙動は異なります。    ポップアップブロックが働く場合があります。

MRFAGPZ
質問者

お礼

原因もわかったし、うまく出来ました。ご説明ありがとうございました。

関連するQ&A

  • HTMLフォームボタンによるターゲットフレームを指定したリンク

    上下にフレーム分割してあり、上をname="header",下をname="contents"としてあります。 head側のHTMLに記述したフォームボタンを押すと、親ウインドウ(target="_parent")に リンク指定先が展開されるようにしたいのですが下記の記述ではうまくいきません。 意図した親ウィンドウでなく、head側のフレーム内に展開されてしまいます。 <input type="button" name="01a" value="前へ" onclick="parent.head.location.href='../hoge1/1.htm'"> <input type="button" name="03a" value="目次" onclick="parent.head.location.href='../index.html'"> <input type="button" name="03a" value="次へ" onclick="parent.head.location.href='../hoge3/3.htm'"> 参考にしたのは以下ですが、何が誤っておりますでしょうか。よろしくお願い致します。 http://www.west-mira.jp/javascript/link/button2.html

  • リンクボタン

    ボタンを押してリンク先に飛ぶようにするには <form><input type="button" value="homeへ" onClick="location.href='home.html'"></form> とすれば可能ですがこれをJavaScriptを使わずに出来る方法はないものでしょうか? どうしても画像など使わずにボタンで実現させたいのですが。

    • ベストアンサー
    • HTML
  • HPボタンの長さが異なる。

    下のボタンが マックの「IE4.5」「IE5.0」「ネスケ4.7」だとちゃんと奇麗に中央に表示されますが、 Windows「IE4.5」「IE5.0」はボタンの長さが異なり ガタガタになります。 windowsでも奇麗に並べるにはどうしたらいいのでしょうか? よろしくご指導お願いいたします。 テストでアップしてあるURLですのでご確認してください。 http://watn.jp/test/ <HTML> <HEAD> <TITLE>++++</TITLE> </HEAD> <!------------------- 中身-------------------> <center> 下のボタンがマックの「IE4.5」「IE5.0」「ネスケ4.7」だと<br> ちゃんと中央に表示されますが、Windows「IE4.5」「IE5.0」は<br> ボタンの長さが異なりガタガタになります。 <FORM> <INPUT TYPE="button" VALUE=" ●●・・◇◇◇   " onClick="window.location.href='kituke.html'"><br> <INPUT TYPE="button" VALUE="   ・・◇◇◇◇  " onClick="window.location.href='sadou.html'"><br> <INPUT TYPE="button" VALUE="   ・・◇◇◇◇◇ " onClick="window.location.href='buyou.html'"><br> <INPUT TYPE="button" VALUE=" ●●・・◇◇◇   " onClick="window.location.href='ivent.html'"><br> <INPUT TYPE="button" VALUE="   ・・◇◇◇◇  " onClick="window.location.href='tenjikai.html'"><br> <INPUT TYPE="button" VALUE=" ◇◇◇       " onClick="window.location.href='butai.html'"><br> <INPUT TYPE="button" VALUE=" ◇◇◇◇      " onClick="window.location.href='honten.html'"><br> <INPUT TYPE="button" VALUE=" ◇◇◇◇◇     " onClick="window.location.href='yono.html'"><br> </FORM> </center> </BODY> </HTML>

  • ボタンリンクをしたいのですが・・・

    ボタンの形でリンクをしたいのですが、うまくできません。 <a>タグのテキストリンクならページが移動するのですが、 <a href="URL"><button>文字</button></a> は、ボタンがペコペコするだけで、 <form><input type="botton" value="文字" onclick="parent.main.location.href='URL'" title="文字"></form> は、ステータスバーにエラーが出ただけです。 何がいけないのか分からないし、他にどうすればいいのかもさっぱり分かりません。 IE6.0を使っていますが、IE依存タグは避けたいです。 ボタンリンクのやり方についてアドバイスをいただけないでしょうか。

  • ボタンで、リンクを、別ウィンドウで開く

    質問させていただきます。 ボタンで、リンクを、別ウィンドウで開くには どういうソースを書いたら良いのでしょうか? <FORM> <INPUT TYPE="button" VALUE="リンク" onClick="window.location.href='index.html'"> </FORM> だと、同一ウィンドウ内に開いてしまいますし・・・。 どうか教えてください。よろしくお願いいたします!

  • ラジオボタンのことについて。

    はじめましてm(__)m ラジオボタンについての質問なのですが。 いま、フレームを横に3つに分けているのですが。 最上段のフレームのところにラジオボタンでリンクし最下段にリンクさせたいのですがまずラジオボタンを作りますよね? <INPUT TYPE=radio VALUE=★.html onClick=location.href=this.value>リンク それで星のところにURLを入れボタンを作るまではわかったのですが。 そのあとどうやってフレーム最下段にリンクさせればいいのでしょうか? <INPUT TYPE=radio VALUE=★.html"target="shita" onClick=location.href=this.value> でtarget="shita"というのも書いてみたのですが・・ やはり出来なくて質問させていただきました。 どうぞご指導のほどよろしくお願いしますm(__)m

    • ベストアンサー
    • HTML
  • ボタンの長さを変えたい(至急)

    <INPUT TYPE=BUTTON VALUE="最新100回グラフ" onClick="location.href='../grf/100.htm'"> <INPUT TYPE=BUTTON VALUE="最新50回グラフ" onClick="location.href='../grf/50.htm'"> このようなボタンの長さを揃えたいです。 スペースで調節するしかないのでしょうか?

    • ベストアンサー
    • HTML
  • HTMLでリンクへジャンプする場合

    「リンク」というボタンをクリックして、「ジャンプします」と表示させて、OKをクリックの後、ページへジャンプできるようにしたいのですが。自分でやってみたところ、ジャンプは出来るものの、なぜかタブが二つ開いてしまうので、一つだけで開けるように改善したいです。(ちなみにとりあえずYAHOO!のリンクです) <a href="http://yahoo.co.jp"target="_blank"> <input type="button"value="リンク"onclick="{alert('ジャンプします')}"></a> メモ帳などに貼り付けて拡張子をHTMLにかえてみて頂ければ(言わなくてもわかりますよね・・・)、分かると思います。 あと、文字やボタンをクリックさせてコメントを出す場合、コメントを複数行にでるにはどうすればいいでしょうか?

    • ベストアンサー
    • HTML
  • リンクの追加

    下記のソースでとじるボタンをクリックするとリンク先をしていしたい。 たとえばYahooにとばしたい。http://www.yahoo.co.jp/ 修正する場所を教えてください。 "<input type=""button"" value=""印 刷"" onclick=""window.print()"">  <input type=""button"" value=""とじる"" onclick=""link()"">" & _

  • ボタンをファイルにリンクさせたい

    お世話になります。 HTMLで <button type="button" name="button" value="button"> <font size="3"><b>テスト</b></font></button> <br><br> 上記のような感じでボタンを作りました。このボタンを あるファイルにリンクさせたい(URLでなくてファイル)のですが、 できますか? ネットで検索すると、URLの場合ですが <Form><Input type="button" value="テスト" onClick="location.href='http://test.jp/'"></Form> 上のように出ていますが、どこにどのようなタグを打てば いいのでしょうか? 宜しくお願いします。

    • ベストアンサー
    • HTML

専門家に質問してみよう