サポート » 使い方全般 » ajaxでhtmlを取得

  • 解決済 wise1489

    (@wise1489)


    ajaxを使用し、テーマフォルダに入っているHTMLファイルを取得して表示したいのですができません。

    script.js

    $(function() {
        $('.about').click(function() {
            $.ajax({
                   type: 'GET',
                   url: 'test.html',
                   dataType: 'html',
                   success: function(data) {
                       $('.ajaxget').append(data);
                   },
                   error:function(XMLHttpRequest, textStatus, errorThrown) {
                       alert('問題がありました。');
                       console.log("XMLHttpRequest : " + XMLHttpRequest.status);
                       console.log("textStatus     : " + textStatus);
                       console.log("errorThrown    : " + errorThrown.message);
                   }
            });
        });
    });

    上記記述で、404エラーが帰ってきます。
    パスの記述方法が間違っているのでしょうか?

    WordPress,Ajax共に無知で大変申し訳ございませんが、
    お力お貸しいただければ幸いです。よろしくお願いいたします。

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • こんにちは

    相対 URL の起点は現在の URL となります。
    テーマ(子テーマ)のフォルダの test.html ということなので、JavaScript 側へテーマのフォルダの場所を渡す必要があります。

    例)

    functions.php

    function my_enqueue_scripts(){
    	wp_enqueue_script( 'my-script', get_stylesheet_directory_uri() .'/script.js', array( 'jquery' ) );
    	wp_localize_script( 'my-script', 'my_script_vars', array( 'url' => get_stylesheet_directory_uri() . '/test.html' ) );
    }
    add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts' );

    script.js(抜粋)

    $.ajax({
         type: "GET",
         url: my_script_vars.url,
         dataType: "html",
    トピック投稿者 wise1489

    (@wise1489)

    ご返信ありがとうございます。

    教えていただいたコードで、無事理想の処理をしてくれました!
    勉強不足でお恥ずかしい限りです。
    ありがとうございました!

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • トピック「ajaxでhtmlを取得」には新たに返信することはできません。