- ベストアンサー
サブミット URLを開きたい
サブミットでもコマンドボタンでもどちらでもいいのですが ボタンをクリックしたら、ＵＲＬを開く方法はありますか？ サブミットボタンを押したら、 <a href="http://www.yahoo.co.jp/" target="_blank">新たなウインドウで開く</a> この動きを実行したいです。
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
<button type="button" onclick="window.open('http://www.yahoo.co.jp/','_blank');">新たなウインドウで開く</button>
その他の回答 (2)
- ralf124c
- ベストアンサー率52% (232/446)
FORMタグに target="_blank" を入れて試してみましたか？
お礼
回答ありがとうございました。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
リンクなのですから、HTMLはリンクのままで良いですよ。 プレゼンテーションはスタイルシートで指定するのが原則ですから <a href="http://www.yahoo.co.jp/" onclick="window.open('http://www.yahoo.co.jp/'); return false;">Yahoo!</a> 単純に・・ a[href="http://www.yahoo.co.jp/"]{ display:inline-block; padding:0.5em 2em; border:outset 5px silver; text-decoration:none; color:black;background-color:silver; } a[href="http://www.yahoo.co.jp/"]:hover, a[href="http://www.yahoo.co.jp/"]:focus{ color:gray; background-color:white; border-color:gray; } a[href="http://www.yahoo.co.jp/"]:active{ border-style:inset; color:white; background-color:gray; } とか 画像にすることも、その段落の右や左に置くこともスタイルシートで自由自在にできます。media="screen"に適用ユーザーエージェントを指定しておくと、印刷や携帯電話にはこのデザインは適用されませんし、検索エンジンにもリンクだと認識してもらえます。 構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4.1 ) [実例] ★Another HTML Lint - Gateway( http://www.htmllint.net/html-lint/htmllint.html# ) のDATAで検証済みのHTML4.01strict + CSS2.1です。 ★javascriptが無効のブラウザでもリンクします。 ★印刷や携帯電話、点字端末、スクリーンリーダー、そして検索エンジンにもＯＫ ★ウィンドウ幅に依存しません。 ★タブは＿に置換してあるので戻す。 <!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"> ＿<meta http-equiv="content-script-type" content="text/javascript"> ＿<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" media="screen"> <!-- html,body{margin:0;padding:0;} h1,h2,h3,h4,h5,h6{margin:0;line-height:1.6em;} p{text-indent:1em;} div.header,div.section,div.footer{width:90%;min-width:630px;max-width:900px;margin:0 auto;padding:5px;} a[href="http://www.yahoo.co.jp/"]{ display:inline-block; padding:0.5em 2em; border:outset 5px silver; text-decoration:none; color:black;background-color:silver; } a[href="http://www.yahoo.co.jp/"]:hover, a[href="http://www.yahoo.co.jp/"]:focus{ color:gray; background-color:white; border-color:gray; } a[href="http://www.yahoo.co.jp/"]:active{ border-style:inset; color:white; background-color:gray; } --> ＿</style> </head> <body> ＿<div class="header"> ＿＿<h1>タイトル</h1> ＿＿<p>このページでは<a href="http://www.yahoo.co.jp/" onclick="window.open('http://www.yahoo.co.jp/'); return false;" onkeypress="window.open('http://www.yahoo.co.jp/')">Yahoo!</a></p> ＿</div> ＿<div class="section"> ＿＿<h2>見出し</h2> ＿＿<p>本文はsection</p> ＿＿<div class="section"> ＿＿＿<h3>項見出し</h3> ＿＿＿<p>本文項記事</p> ＿＿＿<p>sectionの階層でレベルが判断される</p> ＿＿</div> ＿</div> ＿<div class="footer"> ＿＿<h2>文書情報</h2> ＿＿<dl class="documentHistry"> ＿＿＿<dt id="FIRST-PUBLISHED">First Published</dt> ＿＿＿<dd>2013-03-03</dd> ＿＿</dl> ＿</div> </body> </html>
お礼
回答ありがとうございました。
お礼
回答ありがとうございました。