WebClub - Всероссийский Клуб Веб-разработчиков
WebClub.RU » Архив » Передача данных для HTML-файлов и их обработка без привлечения CGI

Передача данных для HTML-файлов и их обработка без привлечения CGI


Дата публикации: 17-03-2013

Мало где вы сможете встретить рассматриваемые здесь вопросы. Почему-то большинство создателей учебников по javascript и DHTML старательно умалчивают данный аспект. Меж тем тема интересная, не сложная и весьма полезная.
Как передать данные в *.html-файл.
Очень просто - через его адрес (URL). После адреса ставите знак вопроса и после него задаете параметр, который хотите сообщить файлу. Если нужно передать несколько параметров, разделяете их амперсандом. Например, так
"file.html?1234" или
"file.html?12&42&param&78456"

Можно передавать данные из формы, используя метод get. В этом случае вызов файла будет выглядеть как
"file.html?name1=value1&...nameX=valueX"
Как получить переданные данные

Как вы догадываетесь, обрабатывается все с использованием javascript.
var ex_url=location.search.substring(1);
То бишь мы записываем в переменную ex_url все то, что находится после знака вопроса. Если вы передаете один параметр, то все - обрабатывайте ex_url (кстати, ее тип - строка) и в зависимости от ее значения что-либо делайте. Если вы передaвали несколько параметров, надо их разделить.
var param=ex_url.split('&');
Теперь мы получили массив param, содержащий переданные значения. Если вы передавали данные через форму, то надо еще избавиться от знаков равенства.
var values = new Array();
for(i=0; i<param.length;i++) {
var b = param[i].split('=');
values[b[0]] = unescape(b[1]);
}
Теперь все данные занесены в хеш. Если строка запроса была, например,
"file.html?name=alex&age=28&left=right"
то получили массив
values[name]="alex";
values[age]="28";
values[left]="right";

или
values[0]="alex";
values[1]="28";
values[2]="right";
кому как больше нравится.
Пример использования

В качестве примера рассмотрим такую ситуацию. Есть набор фотографий и, помимо обычной галереи с предпросмотром, нужно организовать слайд-шоу. Можно, конечно, изменять свойство src картинок, но Netscape, например, не позволяет при этом изменять размеры и все картинки будут втиснуты в рамки самой первой, следовательно, искаженными. К тому же, желательно, чтобы при просмотре новой фотографии обновлялись и баннеры, а вставлять для каждого свой скрипт неохота. Поэтому сделаем следующее:

Для простоты предположим, что все фотографии сохранены в файлах 1.jpg, 2.jpg, 3.jpg и так далее. Делаем страничку, а в том месте, где должна быть фотография, вставляем следующий скрипт.

<table>
<script language=javascript>
max_num=100;
ex_url=location.search.substring(1);
if (ex_url.length==0) {
number=1;
}
else {
number=parseInt(ex_url,10);
}
prev=number-1;
next=number+1;
if (number<2) {
}
else {
document.write("<a href=file.html?"+prev+">back</a>");
}
if (number==max_num) {
}
else {
document.write("<a href=file.html?"+next+">next</a><br>");
}
document.write("<img src="+number+".jpg>");
</script></table>
Комментарии: max_num - число фотографий. Я написал 100, но в принципе их число неограничено, вставьте свое значение. над картинкой выводятся ccылки на предыдущую и последующую. Для первой нет предыдущей (но вы можете вставить ссылку на другой файл), для последней нет следующей (и опять вы можете вставить ссылку на другой файл). Eсли никакие параметры не передаются, то есть не указан номер просматриваемой фотографии, показывается первая. Для простоты примера я не вставлял "защиту от дураков" - то есть если кто-то решит передать в файл не число, а просто набор символов. В этом случае просто не будет никакой картинки.

Скорее всего, при проверкe работоспособности описанного выше метода в домашних условиях, у вас возникнут проблемы. Дело в том, что для приема данных нужен сервер. Windows без наворотов такие запросы не понимает - выдает радостное сообщение. Если у вас не стоит Apache или сервер Windows NT, и вы не хотите с ними возиться - и не надо, установите Small HTTP Server. Эта манюсенькая программа (размером менее, чем сумма всех баннеров на данной странице) позволит вам тестировать в домашних условиях CGI, SSI, PHP и т.д.

Домен продается

Популярное

Не так давно в сети появился новый сервис, под названием Dead Man Zero. Этот сервис сделал...
Рынок социальных площадок уже давно стал стабильным. Несмотря на то, что время от времени...
Artisteer 4 – единственный в своем роде продукт, позволяющий автоматизировать работу над созданием...
Апрель 2024 (1)
Октябрь 2018 (14)
Февраль 2017 (3)
Январь 2017 (1)
Август 2016 (1)
Май 2016 (2)

Карта сайта: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41

Друзья сайта



Случайная цитата

Cory Dodt:

"Если называть Python заменой BASIC, то тогда и трансформер Optimus Prime — это только замена грузовика."

Опрос

Как Вам новый дизайн сайта?

Отлично
Неплохо
Нормальный
Ужасно