ページ内の移動方法について

このQ&Aのポイント
  • ページ内での移動方法について教えてください。
  • ページ内の移動方法について、ボタン以外の方法を知りたいです。
  • ページ内の移動方法についてお知りになりたいです。
回答を見る
  • ベストアンサー

<a href="#pagetop">以外での移動方法

<a href="#pagetop">ページトップ</a>以外での、同一ページ内の移動方法を教えてください。 ページの先頭に、 <a name="pagetop"></a> を置いておいて、ページの下のほうに、 <FORM> <INPUT TYPE=button value="ページトップ" onclick="JavaScript:location.hash='#pagetop'"> </FORM> これで、移動できるのですが、これですとボタンになってしまいます。 普通のテキスト、もしくは画像にしたいのですが、どのようにしたら良いでしょうか? よろしくお願いします。

  • aki24
  • お礼率81% (65/80)

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

  • ベストアンサー
  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.2

>ショップシステムのページで使用したいため、 ><a href="#pagetop">ページトップ</a>では、 >ページのトップに移動することが出来ません。 <a href="#pagetop">で移動できないものは、 location.hash='#pagetop'でも移動できないですよ? 勘違いがあるのではないでしょうか? とりあえずどうしてもjavascriptで飛びたいなら aをトリガーとするものを書けばいいのです こんな感じ? <a href="javascript:void(0)" onClick="location.hash='#pagetop'">ページトップ</a> ただ、javascript非対応のブラウザだと 誤動作しますので、その対応まで考えると こんな感じで。 <script language="javascript"> <!-- document.write('ページトップ'.link('#pagetop')); //--> </script> <noscript> <a href="#pagetop">ページトップ</a> </noscript>

aki24
質問者

お礼

回答ありがとうございました。 <a href="javascript:void(0)" onClick="location.hash='#pagetop'">ページトップ</a> を使わせていただきます。 でも、実際に、<a href="#pagetop">ページトップ</a>と一緒に置いてみても、location.hashはちゃんと動作するんですけれど、a hrefでは他のページに飛ばされてしまうんです。どうしてでしょうね・・・? ともかく、ありがとうございました。

その他の回答 (2)

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.3

>普通のテキスト <span onclick="…">普通のテキスト</span> >画像 <img … onclick="…">

aki24
質問者

お礼

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

noname#25358
noname#25358
回答No.1

 補足をお願いします。 1.なぜ <a href="#pagetop">ページトップ</a> では駄目なのですか? 2.どういう形が理想ですか?

aki24
質問者

補足

関心を寄せてくださってありがとうございます。 ・1について ショップシステムのページで使用したいため、<a href="#pagetop">ページトップ</a>では、ページのトップに移動することが出来ません。 ・2について 質問に書いたような簡単なJavaScriptで、ボタン状でないものが理想です。 (このままで動作はするのですが、できればテキストか画像で...) 宜しくお願いします。

関連するQ&A

  • location href=""

    お世話になります 動作確認をしていてたのですが教えてください <script language="javascript"> <!-- function change(){ location.href="test1.html"; } /--> </script> <input type="button" value="送信" onclick="change()"> IE,Opera,Firefoxで試したのですが、Firefoxではページが切り替わりませんでした 何故でしょう?

  • どこにJavascriptが使われてるかわからない

    このタグのどこにJavascriptが使われてるか教えてもらえますか? <body> <form> <input type="button" value="HOMEページへ移動" onclick="document.location = 'http://www.yahoo.co.jp/';" /> </form> </body> これです。 document.location がJavascriptなのでしょうか?

  • JavaScriptが表示されません

    JavaScriptの練習をしています。 階層型メニューの表示ができるようになりたいのですが、今のところは基礎からと思い、単純なところから初めて・・・みようとしたのですが どしょっぱつから、ひっかかりました ◆例1 <script language="JavaScript"> <!-- document.write(こんにちは); //--> </script> ◇結果 IE画面上に、なにも表示されません ※以前、全く同じ構文で試したときには こんにちは が表示されました。 ※環境は同じで、変わっていません ◆例2 <form> <input type="button" value="戻る" onclick="history.back()"> <input type="button" value="更新" onclick="location.reload()"> <input type="button" value="進む" onclick="history.forward()"> <input type="button" value="トップページへ" onclick="location.href='http://www.red.oit-net.jp/tatsuya/index.htm'"> </form> ◇結果 これは、表示されました。 何回試しても、ちゃんと表示されます +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ いったい何が問題なのでしょうか?

  • 新規ウインドウから他のページにいけますか?

    JavaScriptのwindow.openでページを表示した時に小さな別Windowも表示させるようにしています。 その画面を閉じるのに <input type="button" value="CLOSE" onclick="window.close()"> をクリックすると閉じるのですが、もう一つボタンを付けてそのボタンをクリックするとTOPページに戻るようにしたいんです。 location.href = "URL";で他のページにいけるんですよね? ボタンを表示させるには <input type="button" value="TOP" onclick="window.location.href="URL";"> でいいのでしょうか? やってみたのですが何も動きません。 どなたかわかる方、教えて頂けないでしょうか?よろしくお願いします。

  • a.href の href を有効か無効にする選択

    <script language="JavaScript"> function fa(obja){ if(confirm())obja.href="a.html" else{obja.href=eval("javascript:void(0)") inp.value=0//↑がうまくいかない。hrefを無効にしたい。 } } function fb(objb){ if(confirm())window.location="a.html" else{inp.value=0//↑がvoiv(0)によって無効で動作しない。 } } </script> <a href=a.html>りんく</a><a href=javascript:voiv(0) onClick=inp.value=0>ばりゅ</a> <br>↑と同じようなことを1つのaタグでやりたい<br> <a href="" onClick=fa(this)>失敗A</a><br> <a href=javascript:voiv(0) onClick=fb(this)>失敗B</a><br> <input id=inp> 選択によってクリックのアクションを変更したいんだけど、 1方のアクションはリンク、もう1方はJavaScriptです。 ボタンとかならできるんだけど、クリック済みかを 色分けしたいからaタグでやりたいんです。 よい方法を教えてください。

  • 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>

  • リンクボタン

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

    • ベストアンサー
    • HTML
  • 自動リンク(a href)でフレーム解除方法

    いつもお世話になっております。 HTMLのカテゴリかな?とも思いましたが、今書いているのがASPですのでここで質問させていただきました。 フレームで構成されているページ(上下2分割)より 自動ジャンプ(?)でフレームを解除して、 あるページへとリンクさせたいのです 今は Response.Write "<meta http-equiv=""refresh"" content=""1;URL='main.asp?id=10 target=_top"">" ↑とやってみましたがうまくいきません。 単純にリンクを張る Response.Write "<a href=""main.asp?id=10"" target=_top>メイン</A>" っていうのはうまくいきました。 可能であれば下記も同じようにジャンプさせたいです(こちらはボタンを押したとき) Response.Write "<input type=""button"" value=""メイン"" onClick='JavaScript:location.href=""main.asp?id=10""'>" そもそもこんなんASPじゃできねーんだよ! XXXXXならできるけどなー。 などのアドバイスでも構いません。 どうぞよろしくお願いします。

  • POSTで<a hrefを送る方法について

    POSTで <a href=sample.cgi?md=aa&tx=zz~>hoge</a> <a href=sample.cgi?md=bb&tx=yy~>hoge2</a> <a href=sample.cgi?md=cc&tx=xx~>hoge3</a> <a href=sample.cgi?md=dd&tx=ww~>hoge4</a> を送る方法でjavascriptとの組み合わせで出来るのかな? と思い検索したら <form action="./sample.cgi" method="POST" name="post"> <input type="hidden" name="md" value="aa"> <input type="hidden" name="tx" value="zz">           : <a href='#' onClick="document.post.submit();return false">hoge</a> <form action="./sample.cgi" method="POST" name="post2"> <input type="hidden" name="md" value="bb"> <input type="hidden" name="tx" value="yy">           : <a href='#' onClick="document.post2.submit();return false">hoge2</a> このような手法が見つかりました これだと行数が多くなり、なんとなくすっきりしません どなたかいい解決方法を教えてください よろしくお願いします

    • ベストアンサー
    • HTML
  • テキストボックスのvalue属性でlocation.hrefをする

    <script type="text/javascript"> function jumpPage(){ location.href = "http://hogemoge.com/foo/" + document.urlform.url.value; } </script> <form name="urlform"> <input type="text" id="url"> <input type="submit" style="display: none;" onclick="jumpPage();"> </form> というHTMLがあります。 しかし実際はページが飛びません。 どうしたら飛ぶようになりますか。

専門家に質問してみよう