Пример простого и удобного метода работы с Ajax в jQuery.

17.06.2012 14:32:35
Данный код работает начиная с версии 1.5 (с появлением в jQuery Deferred Object).

Этот пример обращается к php скрипту "ajax.index.php" с параметром "action=get_val", а так же передает данные "title" и "intro" методом "POST".

1
2
3
4
5
6
7
8
9
10
11
12
13
$.ajax({
    type: "POST",                            // Методом POST
    url: "ajax.index.php?action=get_val",    // Адрес
    data:                                    // Передаваемые параметры
        {
            title: encodeURI($("#title").val()),
            intro: encodeURI($("#intro").html())
        },
}).done(function( data ) {                    // Функция успешного завершения
    var obj = jQuery.parseJSON( data );       // Разбор ответа
    $("#meta_title").val( decodeURI(obj.meta_title) );
    $("#meta_keyword").val(decodeURI(obj.meta_keyword) );
});

Предполагается, что скрипт возвращает данные (meta_title и meta_keyword) в формате JSON.

Формировать такой ответ удобнее всего php функцией json_encode

1
die(json_encode($array));

Данные кодируются и раскодируются функциями encodeURI и decodeURI, с их использованием сеть проблема: все пробелы заменяются на знаки плюс

Пример без комментариев

1
2
3
4
5
6
7
8
9
10
11
12
13
$.ajax({
    type: "POST",
    url: "ajax.index.php?action=get_val",
    data:
        {
            title: encodeURI($("#title").val()),
            intro: encodeURI($("#intro").html())
        },
}).done(function( data ) {
    var obj = jQuery.parseJSON( data );
    $("#meta_title").val( decodeURI(obj.meta_title) );
    $("#meta_keyword").val(decodeURI(obj.meta_keyword) );
});


Категории: JQuery
Яндекс.Метрика