javascriptでonclickを利用して同じ<a>に入っている、hrefのリンク先をページ移動せず表示することは可能でしょうか?


具体的に言いますとPHPのPEARのPagerを使ってページ送りを利用しているのですが
onclickをオプションで使い出来ようなので、javascrptを使ってページ移動せず表示できるのではと思ったのですが、get(this)のような感じで表示することはできるのでしょうか?

当方初心者なもので、解説付きでよろしくお願いします。

回答の条件
  • 1人20回まで
  • 13歳以上
  • 登録:2011/10/29 20:16:58
  • 終了:2011/10/30 15:47:28

ベストアンサー

id:Cherenkov No.3

Cherenkov回答回数1502ベストアンサー獲得回数4922011/10/30 15:21:06

id:robopit

少しもっさりしていますが、よさそうですね。

2011/10/30 15:46:02

その他の回答(2件)

id:kodairabase No.1

kodairabase回答回数661ベストアンサー獲得回数802011/10/29 21:08:19

ポイント10pt

この方法はどうでしょう。

リンク先のサムネイルをプレビュー表示させるjavascript

http://www.signature-web.com/blog/signature_archive/2009/10/javascript_jquery_image_preview/

id:robopit

これはこれでよいものですが、今回の目的とは違う感じです。

あと、書き方が悪かったのですがコメント欄に解説付きでお願いします

2011/10/29 21:20:00
id:Cherenkov No.2

Cherenkov回答回数1502ベストアンサー獲得回数4922011/10/29 21:13:36

id:robopit

ツールチップではないですね

検索結果のページ送りなので

2011/10/29 21:24:54
id:Cherenkov No.3

Cherenkov回答回数1502ベストアンサー獲得回数4922011/10/30 15:21:06ここでベストアンサー

id:robopit

少しもっさりしていますが、よさそうですね。

2011/10/30 15:46:02
  • id:Cherenkov
    質問文の解説をお願いします。なにをどうしたいのかわかりにくいです。
  • id:robopit
    すいません

    やりたいのはページ移動することのないPager機能を作ることです

    PAERのPager機能にonnclickを入れられるらしいと聞いたので
    それならばすこしjavascriptを追加するだけでページ移動しないPagerを実現できるのではと思ったので

    $(this).html()みたいな感じで
    $(this).herf()のようなものがないかと質問させてもらいした。

    私の知っているやり方では、どうしてもjavascirptの処理→herfのリンク先に飛ぶという感じになってしまいます

  • id:okamotoy
      ・hrefに記述するurlのソースを予めコピーする.
      ・自ページにそのソースを含め表示する.
       (ただし,onclickするまでは当該ページは非表示)
      ・onclickされたら,そのソースを表示状態にする.
    で可能です.
     cgiやaspを使えばよいです.
      

     しかし,hrefに書きたいurlが他人のサイトであったならばやり方としてはよろしくないと思いますよ.
     他者が書いた本をコピーして使うようなものなのですから.
  • id:Cherenkov
    これ?
    http://semooh.jp/jquery/api/ajax/load/+url%2C+data%2C+callback+/
  • id:robopit
    okamotoyさん

    予めコピーするといのは
    PEARのPagerの場合
    変数に入れることでしょうか?

    Cherenkovさん

    たぶんこれを使えば出来ると思うのですが
    PEARのPagerと一緒に使い方がわからないのです。
    解説お願いできますのでしょうか?
  • id:okamotoy
     ページャそのものを知らないので実装のしかたは指南できませんです.(知っていれば回答で書きました.)
     ただ,「ページを移動しない」という条件があったので私の知りうるやり方と問題点をコメントで書いた次第です.
  • id:robopit
    なるほど、ありがとうございました。
    色々と試してみたいと思います
  • id:Cherenkov
    Pager使った事無いので
    http://d.hatena.ne.jp/naohide_a/20090718/1247893587
    http://blog.96q.org/2008/09/01/pear-pager-hidden-option/
  • id:robopit
    リンク先については把握済みです

    Pagerは
    <a href="/test.php?pageID=2" title="page 2">2</a>
    みたいな感じで分割ページを出してくれます。


    onclickオプションをいれと

    onclick ='test'

    <a href="/test.php?pageID=2" onclick ='test' title="page 2">2</a>

    と表示してくれます。

    なので
    このhrefアドレスをページ移動せずに開く方法がjavascriptでないか探しています。
  • id:Cherenkov
    PagerにlinkClassを追加して、
    linkClass = 'pagerLink';


    $(function() {
    $('.pagerLink').click(function(e) {
    e.preventDefault();
    var href = $(this).attr('href');
    $('.contents').load(href);
    });
    });

    contentsクラスの要素にloadする。
    とか
  • id:robopit
    ページ移動せずページ送りはできたのですが
    なぜかそれ以降もものをコピーしてしまうんですがなぜなんでしょうか?

    cotentsのところを”#01”にしているのですが


    div=01

    div=02

    の順で設定している場合

    01と情報出てしまいます02

    表示場所を02にすると
    02しかでなくなるのですが
  • id:Cherenkov
    ちょっと意味がわからないです。
    PEAR::HTML_AJAXを組み合わせたサンプルがありました。
    http://www.alberton.info/pear_pager_tutorial_javascript_navigation.html
    デモ:http://www.alberton.info/pear_pager_tutorial_javascript_navigation_ajax_example.html
  • id:robopit
    すいません


    01と情報出てしまいます02



    01と02のhtmlが両方出力されてしまいます。

    <div=1>
    テスト1
    </div>

    <div=2>
    テスト2
    </div>

    だったのが

    <div=1>
    テスト1
    </div>
    <div=2>
    テスト2
    </div>
    <div=2>
    テスト2
    </div>

    みたいな感じになります
  • id:robopit
    すごいもっさりしてるのが気になりますが
    PEAR::HTML_AJAXよさそうですね。
  • id:robopit
    解決しました。

    たぶんですけど
    出力先に読み込むページをすべて表示するために2重表示してたみたいなので

    全体をdivで囲んでそこを出力先にしたら大丈夫でした

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

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません