通常のリンクが自動的にではなく、通常よりも、AJAXを介して負荷作る方法はありますか？

StackOverflow https://stackoverflow.com/questions/1449074

質問

私はよくこのことを説明していない。

しかし、私は何を意味することは、ある私は機能を通じて、DIV要素内のページのコンテンツをロードするAjaxのスクリプト「loadpage（」whatever.php '）;,代わりに、手動で回ってすべてにこれを行うのを持っている場合リンク、自動的にすべての通常のリンクは、そのAjaxの機能を介して負荷になり、スクリプトを持つ方法はありますか？

のFacebook上のように、自分のプロファイルをロードAJAXを通じて、まだあなたは自分のコードを見れば、彼らはただのプロファイルへの定期的なリンクを持っています。

乾杯！

役に立ちましたか？

解決

確かに、あなたはjQueryを使ってそれを行うことができます。

このスクリプトは文書を通過し、すべてのアンカー要素を見つけ、それぞれのクリックイベントにイベントハンドラをバインドします。アンカー要素がクリックされると、イベントハンドラは、（あなたはもちろん、あなたが好きなこのdiv要素を呼び出すことができます）#targetDivにそのページhref属性と負荷を見つけます。

<script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
  $("a").click(function() {
    $("#targetDiv").load(($(this).attr("href") + " body");
    return false;
  });
});
</script>

...

<!-- In your document body, this is the div you'd load the pages into. -->
<div id="targetDiv"></div>

他のヒント

（私はあなたの質問を理解していれば右）

あなたは、このためのjQueryを使用することができます。

まず、あなたは次のように）（関数loadpageを作ることができます 

function loadpage(divId, url) {
    $('#' + divId).load(url);

    return false;
}

.LOAD（）は、しかし、すべてのブラウザでサポートされていません。あなたは.LOADせずにこれをしたい場合は（）、あなたは（）に.getをチェックアウトすることができます。 .LOAD（）詳細については、 http://docs.jquery.com/Ajaxを見てみましょう/ のロード

私はそれがこのような何かを行くだろうと仮定しています：

$(document).ready(function(){
    $("a").click(function(){
        $("body").load($(this).attr("href") + " body");
        return false;
    });
});

これは、ページ上のすべての<a>タグは、タグのhref属性からHTMLドキュメントをダウンロードする機能を呼び出す作ることのbodyタグを取り除くと、新しい内容で現在のページのbodyタグの内容を置き換えますbodyタグ。この方法は、それが無いJavaScriptでこれを仕事だけでなく、既存のサイトに統合する方が簡単です。

これを使用するには、あなたのメインページの頭の中で、あるいは外部JSファイルに<script>タグにこれを置きます。

このコードはのみ<body>タグの内容を更新し、（タイトルタグを含む）ヘッドがそのまま残っていること、しかし、注意してください。あなたはこのようなものを更新するために、余分なコードを追加する必要があります。

シンプルでナイス。これをチェックアウト： Bjaxする

使用方法：

<script src="bjax.min.js" type="text/javascript"></script>
<link href="bjax.min.css" rel="stylesheet" type="text/css" />

最後に、あなたのHTMLのHEADでこれを含めます 

$('a').bjax();

の詳細設定については、ここでチェックアウトのデモ： Bjaxデモする

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top