вторник, 30 июля 2013 г.

Необходимо передать на сервер набор параметров, не перезагружая при этом страницу браузера. Расскажите, как это сделать: перечислите все возможные способы и назовите самый кроссбраузерный.

Необходимо передать на сервер набор параметров, не перезагружая при этом страницу браузера. Расскажите, как это сделать: перечислите все возможные способы и назовите самый кроссбраузерный.

Вариант 1. Создание картинки, в результате загрузки которой на сервер будут переданы наши данные.

var image = document.createElement('img');
img.id = 'dummyImage';
img.src = '/send/dummy.gif?data1=one&data2=two';
img.onload = function(){
    document.body.removeChild(document.getElementById('dummyImage'));
    alert('Данные на сервер отправлены.');
};
document.body.appendChild(img);

Вариан 2. Создание iFrame, в результате загрузки содержимого которой на сервер будут переданы наши данные.

var iframe = document.createElement('iframe');
iframe.src = '/send/dummy.gif?data1=one&data2=two';
document.body.appendChild(iframe);

Вариант 3. Создание тэга script, загружающего JavaScript-файл с сервера.

var script = document.createElement('script');
script.src = '/send/dummy.gif?data1=one&data2=two';
document.head.appendChild(script);

Вариант 4. Отправка AJAX-запрос через создание объекта XMLHttpRequest.

var data = 'data1=one&data2=two';
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://site.com/', true);
xhr.onreadystatechange =  function(){
    if (xhr.readyState === 4) {
        if (xhr.status === 200) {
            alert('Данные на сервер отправлены.');
        } else {
            alert('При отправке запроса на сервер произошла ошибка.');
        }
    }
}
xhr.send(data);

1 комментарий: