jqeryのajaxひな型| プロサバメモ

WEBプログラミングやサーバ設定などのメモ場

jqeryのajaxひな型

2022.03.22

ajaxの書き方をすぐ忘れてしまうので、ひな型としてメモしておきます。

function ajax_post {
    let hoge1_ele = document.getElementById( 'hoge1' );
    let hoge2_ele = document.getElementById( 'hoge2' );
    $.ajax( 'https://sym.me', // リクエストするurl。phpなど。
        {
            type: 'POST', // GETなりPOSTなり
            data: { // リクエストする渡すデータをここで組み立てる。
                'name1': hoge1_ele.value,
                'name2': hoge2_ele.value,
                ・
                ・
                ・
            }
        }
    )
    .done( function( data ) {
        // ajaxが成功した時の処理はここ
        // dataにはurlからのレスポンスが入る
        // ※dataにjsonを受ける場合は、JSON.parse( data )しないとjsonとして取り扱えないので注意。
    })
    .fail( function() {
        // ajaxが失敗した時の処理はここ
    });
}

ajaxが成功した場合、.doneでdataにjsonを受ける場合は、JSON.parse( data )でデータをパースしないとdataをjsonとして取り合え使えないので注意。

関連記事

TOP