Реализация AJAX на сайте средствами jQuery

Итак, я расскажу, как при помощи javascript фреймворка jQuery можно делать AJAX-запросы PHP скриптам.

Нам понадобится:
— заранее написанный PHP-скрипт
— немного времени

1. Подключаем сам jQuery



Скачать последнюю версию можно отсюда

2. Пишем JavaScript, например такого содержания:

function viewfiles(topic) {
jQuery.ajax({
type: "GET",
data: 'topic=' + topic,
url: './ajax/files.php',
success: function(data){
jQuery("div#inside_area").empty();
jQuery("div#inside_area").html(data);
}
})
}

Разберем скрипт поподробней.

type: "GET",

тип запроса к PHP скрипту, может быть GET или POST (в зависимости от метода приема данных PHP скриптом)

data: 'topic=' + topic,

данные, отсылаемые скрипту

url: './ajax/files.php',

путь до PHP скрипта

success: function(data){
jQuery("div#inside_area").empty();
jQuery("div#inside_area").html(data);
}

Эта часть обрабатывает ответ от скрипта. Сначала очищается слой, в который пишется ответ (inside_area — id слоя), потом в этот слой вставляются данные.

Дальше надо собрать все в одну HTML-страницу и пробовать.

Пример для files.php
<?php
echo $_GET['topic'];
?>