web-dev-qa-db-ja.com

Ajaxを使ってdivにコンテンツをロードする

アドバイスをお願いしますajaxは初めてのことですが、投稿のリストがあります。クリックすると、ページを読み込まずにdivの投稿情報を表示します。私は私がajaxを使わなければならないことを知っているので、私はルートフォルダの中にファイル:loadcontent.phpを作成し、以下のこのコードを使います、しかし私はajaxを通してデータを送って得る方法を知りません。投稿情報を取得するには、IDを渡す必要があります。

<script>
   $(document).ready(function(){

    $.ajaxSetup({cache:false});
        $(".post-link").click(function(){
        var post_id = $(this).attr("rel"); //this is the post id
        $("#post-container").html("content loading");
        $("#post-container").load("/loadcontent.php");
       return false;
    });

  });
</script> 
1
Yoona

WordPressが提供するAjax APIを使用してください。

初めて、Ajaxリクエストを修正します。

<script>
$(".post-link").click(function(){
    var post_id = $(this).attr("rel"); //this is the post id
    $("#post-container").html("content loading");
    $.ajax({
        url: myapiurl.ajax_url,
        type: 'post|get|put',
        data: {
            action: 'my_php_function_name',
            post_id: post_id
        },
        success: function(data) {
            // What I have to do...
        },
        fail: {
            // What I have to do...
        }
    });
    return false;
});
</script> 

今、あなたはあなたのWordPress治療を作成しなければなりません。このコードはfunctions.phpまたはプラグインファイルに入れることができます。

add_action( 'admin_enqueue_scripts', 'my_ajax_scripts' );
function my_ajax_scripts() {
    wp_localize_script( 'ajaxRequestId', 'myapiurl', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
}

そして...あなたの投稿を取得するあなたの関数

function my_php_function_name() {
    // What I have to do...
}

シモンズ:決してルートインストールフォルダにコードを入れないでください。あなたのテーマのfunctions.phpを使うか、プラグインを作成してください。保守性とセキュリティにとって非常に重要です。楽しむ :)

5
Kaeles