jQueryでAjaxを実装する

テキストファイルを読み込む


$(function(){
 $("#main").load("./test.txt");
});

→#mainの領域にtest.txtの内容が表示される

GET通信

jQuery.get(url,data,callback);



var cTime = new Date();
var theURL = "../aaa.php?id=" + id + "&req=" + cTime.getTime();

$.get(theURL, function(html){
 $("input").val(html);
});


POST通信

$.post(url,data,callback,type);



var cTime = new Date();
var url = "../aaa.php?req=" + cTime.getTime();

$.post(url,
 {"x": x_value, "y": y_value},
 function(data, status) {
  $("#Address").val(data);
 },
 "html" //データ形式
);

通信時の注意

ブラウザのキャッシュ対策として、URLにタイムスタンプをパラメータとして追記する

XMLを取得

$(function(){
    $.ajax({
        url:'test.xml',
        type:'GET',
        dataType:'xml',
        timeout:1000, // タイムアウト
        error:function() {
            alert("XML読み込み失敗");
        },
        success:function(xml){
            // ループ
            $(xml).find("urlset").each(function() {
                alert( $(this).find('url').text() );
            });
        }
    });
});

セキュリティエラーが起きる遷移

SSL
 ↓POST
非SSL

上記以外は全てOK