| |
|
|
| | Я все в толк не возьму, как подгружать контент с сервера при помощи скрипта на клиенской стороне?
Не думайте, я уже порылся в гуглях, поискал в форуме, но внятного и простого рецепта не нашел.
Относительно Ajax кругом много терминов, понятий и технологических изысканий, а мне, простому быдлокодеру, остается непонятным, как можно, скажем, по обработке onClick на пункте меню взять <div id=d1></div> и всунуть в него содержимое файла part_d1.html, не перезагружая страницы? | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(28.04.2009 в 12:04)
| | | >"всунуть в него содержимое файла part_d1.html, не перезагружая страницы"
Здесь вам AJAX не поможет. Всунуть при помощи AJAX в общем случае вы сможете файл part_d1.php, а никак не part_d1.html (хотя можно и html-файл, но это требует отдельной настройки вашего сервера).
В AJAX'е всё примитивно.
Главное в этом деле - вам надо иметь возможность писать программы на PHP и помещать их на свой сервер, на котором установлен PHP.
Смотрите, например, http://codecenter.awardspace.com/selects.html - по выбору области (Московская или Ленинградская) браузер запускает функцию sendReq (x), которая устанавливает связь с сервером и делает запрос на прочтение файла req.php?x.
И сразу же подключается функция getReq (), коя ожидает готовности сервера отдать текстовое содержание этого самого файла req.php?x в виде СТРОКИ.
И уже из этой полученной СТРОКИ в браузере можете делать всё, что угодно - в данном примере формируется новый список городов области.
Если доступа к PHP у вас нет (далеко не все бесплатные хостеры предоставляют возможность загружать программы на серверных языках), то тогда можно обойтись "малой кровью", т.е. сделать тоже самое, но вовсе без AJAX'a. Например, ваш файл с ЛЮБЫМ расширением можно по клику поместить в невидимый ифрейм, затем прочитать его содержимое в виде СТРОКИ и потом снова делать с данной строкой ВСЁ, что вам будет угодно. Разница, по большому счёту, между AJAX'ом и использованием ифрейма только в одном - браузер MSIE при включённом динамике довольно громко щёлкает при загрузке данных в невидимый ифрейм (а при использовании AJAX'а всё происходит беззвучно). | |
| |
|
|
| |
|
|
| |
для: PAT
(28.04.2009 в 12:34)
| | | Агааааа.
Теперь стало проясняться. То есть, по клику я меняю src этого скрытого айфрейма, а он сам отправит новый запрос, или его надо перезагружать как-то?
А как "прочитать в виде строки"? В чью сторону копать? | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(28.04.2009 в 13:15)
| | |
<script>
var P = false; //SRC в ифрейме ПУСТОЙ и при первой загрузке читать его содержимое не нужно
function myFunc ()
{
if (!P) P = true; //ифрейм загрузился первый раз, следующие разы будем читать
else //ифрейм загрузился уже со СВОИМ файлом, который читаем
{
var str = document.frames.IFR.document.body.innerHTML; //читаем содержимое тега body в ифрейме
alert (str); //делаем с этим содержимым, что хотим
}
}
</script>
<iframe id="IFR" onload="myFunc ()" style="display: none"></iframe>
<input type="button" onclick="document.getElementById ('IFR').src = 'любой файл с того же домена'" value="Грузим СВОЙ файл (с этого же домена)">
|
PS. Попытка прочтения ЧУЖОГО файла даст ошибку "Permission denied" и остановку скриптов на странице
Пример смотрите здесь - http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=56333 | |
| |
|
|
| |
|
|
| |
для: PAT
(28.04.2009 в 13:43)
| | | >PS. Попытка прочтения ЧУЖОГО файла даст ошибку "Permission denied" и остановку скриптов на странице
А нам чужого и не надо! )))
а без document.body можно?
например, как-то так (ищу почему не работает):
<html>
<head>
<script >
function gothere (itis)
{
document.getElementById('k1').src=itis+'.html';
document.getElementById('d2').innerHTML = window.frames.k1.innerHTML;
}
</script>
</head>
<body>
<iframe scrolling=no hspace=0 vspace=0 frameborder=0 src="main.html" id=k1 name=k1 style="display:none;"></iframe>
<div id='d2'>
</div>
<img src="i/http.jpg" onClick="gothere('pf')">
</body>
</html>
|
Или мне обязательно полноструктурный документ хранить внутри файла с куском страницы? | |
| |
|
|
| |
|
|
| |
для: PAT
(28.04.2009 в 13:43)
| | | О, а этот самый innerHTML - он, часом, не обладает интересным свойством работать только в ИЕ? | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(28.04.2009 в 14:42)
| | | >ищу почему не работает
Как думаете - DJ Paltus.innerHTML будет работать? :-)
В Динамической Объектной Модели есть ОБЪЕКТЫ (window, document, ВСЕ теги страницы
и кое-что ещё).
Эти объекты имеют разные СВОЙСТВА (высота, ширина, цвет текста, цвет фона, бордер...)
Не каждый ОБЪЕКТ обладает ВСЕМИ имеющимися свойствами.
И не каждое СВОЙСТВО поддерживается всеми ОБЪЕКТАМИ.
Например, что бы вы не писали в стилях для тега <DIV style="vertical-align: ..."> - хоть top, хоть bottom,
хоть middle, - текст внутри DIV'a не будет выравниваться по высоте по вашему желанию.
Ибо не поддерживает тег <DIV> свойства vertical-align.
А вот теги <IMG>, <SPAN>, <TBODY>, <TD>, <TFOOT>, <TH>, <THEAD> и <TR> это свойство
поддерживают без проблем.
Так и innerHTML поддерживают далеко не все ОБЪЕКТЫ, а только лишь:
A, ACRONYM, ADDRESS,
B, BDO, BIG, BLOCKQUOTE, body, BUTTON,
CAPTION, CENTER, CITE, CODE, COL, COLGROUP, custom,
DD, DEL, DFN, DIR, DIV, DL, DT,
EM,
FIELDSET, FONT, FORM, FRAMESET,
HEAD, Hn, HTML Comment, HTML,
I, INS,
KBD,
LABEL, LEGEND, LI, LISTING,
MAP, MARQUEE, MENU,
NEXTID, NOBR,
OL, OPTION,
P, PRE,
Q,
RT, RUBY,
S, SAMP, SCRIPT, SELECT, SMALL, SPAN, STRIKE, STRONG, STYLE, SUB, SUP,
TABLE, TBODY, TD, TFOOT, TH, THEAD, title, TR, TT,
U, UL,
VAR,
XMP
|
Как видите, объекта window среди перечисленных выше объектов нет, а вы именно к нему
обращаетесь и пытаетесь прочитать его innerHTML.
Тут всё как у людей - обладать большими деньгами хотят все, но далеко не все могут :-)
>innerHTML - он, часом, не обладает интересным свойством работать только в ИЕ?
Вы, часом, не обладаете СОБСТВЕННОЙ головой и руками, чтобы взять, да и попробовать -
работает ли innerHTML не только в ИЕ?
Или, извините, в туалете вас мама подтирает? Сами не можете? | |
| |
|
|
| |
|
|
| |
для: PAT
(28.04.2009 в 16:12)
| | | Вот вроде и помогаете здорово, но и ругаете обидно.
Домашнее задание будет? | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(28.04.2009 в 16:47)
| | | >Домашнее задание будет?
Если надо, то будет.
Сходите на http://codecenter.awardspace.com/selects.html, разберитесь в коде,
поймите - какого именно вида формируется строка, которую отдаёт PHP-файл и сделайте
страницу ТОЧНО ТАКОГО ЖЕ внешнего вида и функциональности, но которая будет
получать данные посредством загрузки их в невидимый ифрейм.
Таким образом, жду от вас рабочие коды трёх файлов:
1. selects_dg_paltus.html - основной
2. reg_dg_paltus_mos.html - с городами Московской области
3. reg_dg_paltus_len.html - с городами Ленинградской области
Если справитесь, то помещу три этих файла туда же на сервер.
[поправлено модератором] | |
| |
|
|
| |
|
|
| |
для: PAT
(28.04.2009 в 19:09)
| | | Принял, понял, начал.
Еще до модерской поправки (хе-хе) взял формат строки и упаковал их обе-две в reg_dj_paltus_len.htm и reg_dj_paltus_mos.html.
Едва начав разбирать код вывода, пришлось отвлечься, завтра добью.
Главное, чтобы начальство этого не видело... | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(29.04.2009 в 02:50)
| | | >"Главное, чтобы начальство этого не видело"
Это - по-нашему, по-совковому...
Говорить о ДОМАШНЕМ задание, которое ИЗНАЧАЛЬНО планируется делать НА РАБОТЕ:-)
Потому иностранцы и не могут понять русского человека :-) | |
| |
|
|
| |
 1.1 Кб |
|
| |
для: PAT
(29.04.2009 в 09:07)
| | | Знач, так.
Всё работает, но работает неправильно.
Почему-то из iframe считывается предыдущее содержимое, а не текущее. И это меня немало тревожит, даже кушать не могу. Вот код (для дебага iframe видимый и добавлен div, отображающий по идее то, что считалось из iframe).
Что не так?
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=win-1251">
<script>
function get_some(x){
if (x!=='blank')
{
myname = 'reg_dj_paltus_'+x+'.html';
document.getElementById('hf').src=myname;
intext=window.frames.hf.document.body.innerHTML;
document.getElementById('debug').innerHTML=intext;
formSecSel(intext);
}
else {document.getElementById ('scnd').style.display = 'none'};
}
function formSecSel (x)
{
for (var q = document.getElementById ('scnd'), j = q.options.length - 1; j >= 0; j--) q.options [j] = null;
for (var s = x.split ('|'), j = 0; j < s.length; j++)
{
var o = document.createElement ('option'); var t = s [j].split ('=');
o.value = unescape (t [0]); o.text = unescape (t [1]); q.options.add (o);
}
q.style.display = 'inline';
}
</script>
</head>
<body>
<iframe style="display:block" id="hf" name="hf"></iframe>
<select style="width: 234px" onchange="get_some (this.value)">
<option style="color: red" value="blank">Select a region
<option value="mos">Moscovskaja oblast'
<option value="len">Leningradskaja oblast'
</select>
<div id=debug>Ы?</div>
<select id="scnd" style="display:none; width: 123px"></select>
</body>
</html>
|
| |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(29.04.2009 в 11:52)
| | | Мда...
А вы ничегошеньки не поняли.
Поясняю ИШШО раз.
На конкретном жизненном примере.
Положим, познакомились вы с самой симпатичной девушкой этой планеты.
И полюбили её.
И захотели иметь с ней совместных детей.
И, положим, добились вы от неё взаимности в этом своём желании.
Спрашивается - вы вручите этой девушке коляску, пелёнки, распашонки и соску с молоком СРАЗУ ЖЕ после вашего любовного контакта?
Или всё же погодите приблизительно месяцев девять (сорок недель)?
Видимо, всё же подождёте.
Ибо с первого разу ребёнок может и не родиться... так ведь? :-)
Так и здесь.
По событию ONCHANGE тега <select> вы загружаете в ифрейм некий файл.
Вы знаете - КОГДА он полностью загрузится, чтобы можно было его прочитать?
Нет, не знаете.
Но "соску с молоком" суёте сразу - т.е. СРАЗУ ЖЕ читаете содержимое документа, который находится в этом ифрейме.
Выше я приводил пример, где на тег <IFRAME> повешен обработчик ONLOAD.
Вы вроде бы это пример изучали и даже пытались его переделать - читать вместо document.body хотели window.
Так почему ТЕПЕРЬ у вас ВОВСЕ НЕТ никакой инструкции на теге <IFRAME>?
Он у вас теперь "рожает" сразу, как только "засунете"? (извиняюсь за ненорматив).
Окончательно.
Должно быть 3 (ТРИ) функции.
ПЕРВАЯ - "висит" на событии ONCHANGE на первом списке. Загружает в <IFRAME> нужный URL согласно выбору опшена.
ВТОРАЯ - "висит" на событии ONLOAD ифрейма. Читает ПОЛНОСТЬЮ ЗАГРУЗИВШИЙСЯ в ифрейм документ. И вызывает третью функцию, передав ей полученную строку.
ТРЕТЬЯ - из полученной строки переформировывает список с городами. Эта функция у вас есть - переделывать её не надо.
Ну что, попробуете ещё раз? :-)
PS. Читаете вы в ифрейме document.body.innerHTML, так?
И где, спрашивается, у вас теги <body></body> в приложенных вами двух файлах? :-))
PS2. Событие ONLOAD сработает у вас и при вовсе неуказанном значении SRC ифрейма. Как с этим бороться - я выше писал (см. на "флаг" - переменную P = false) | |
| |
|
|
| |
1.1 Кб |
|
| |
для: PAT
(29.04.2009 в 13:45)
| | | АААА!
Я уже все сделал.
Только форум не грузился, фиг чего докажешь.
Вот, в аттаче - работает. Я сам, сам я. Не ругай, дядя РАТ! | |
| |
|
|
| |
|
|
| |
для: PAT
(29.04.2009 в 13:45)
| | | ну, а насчет body - так не вызывает же его отсутствие в файлах с данными ошибки, а? Или есть неведомая мне причина содержать подгружаемые данные в настоящем html-формате? | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(29.04.2009 в 14:02)
| | | Разбор полётов.
Вопрос ПЕРВЫЙ
<iframe style="display:none" id="hf" name="hf" onLoad="further();"></iframe>
|
Объясните ваши соображения, когда вы ифрейму дали имя и отчество ОДИНАКОВЫЕ.
Т.е. он не Василий Иванович у вас, а Василий Василий.
Анекдот в тему:
- Пристегните ремни. Наш самолет сейчас совершит посадку в аэропорту Баден-Бадена.
- Ты чё, тёлка, по два раза повторяешь? Тут же не лохи летят! | |
| |
|
|
| |
|
|
| |
для: PAT
(29.04.2009 в 14:57)
| | | А. Это появилась путаница, когда я не сумел обратиться к iframe по id за innerHTMLом и стал обращаться по name и через window. ((
— Я два раза не повторяю. Понятно? Два раза не повторяю! | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(29.04.2009 в 15:06)
| | | Ясно. Соображений, значится, не было. Была путаница.
Итак, к ифрейму обращаетесь дважды:
Первый раз, как к объекту текущего окна, чтобы изменить его src.
Обращаетесь посредством метода
window.document.getElementById ()
|
, т.е. именно id у ифрейма вам необходим.
Второй раз обращаетесь не к ифрейму, а к окну в этом ифрейме.
Обращаетесь, используя коллекцию , для которой нет никакой разницы - что использовать - что id, что name.
Раз id у ифрейма уже имеется, то, исходя из "принципа разумной достаточности", совершенно незачем давать ещё и name.
----------------------------------------------------
Продолжаем разбор полётов.
Вопрос второй.
В двух вами написанных функциях вы вводите две переменные:
myname = 'reg_dj_paltus_'+x+'.html';
и
intext=window.frames.hf.document.body.innerHTML;
|
которые используете только внутри этих функций.
Почему тогда эти переменные у вас глобальные? | |
| |
|
|
| |
|
|
| |
для: PAT
(29.04.2009 в 15:27)
| | | По назначению имени и id - это ибо ФФ не все равно, что использовать - что id, что name. Ошибка: window.frames.hf is undefined говорит. Наверное, есть метод обращения и для ФФ, но я им не владею, сами понимаете.
ИЕ дейсвительно, позволяет такую фривольность. Просто у меня основной браузер именно ФФ.
А по второму вопросу - каюсь, я просто не владею основами языка, поэтому пишу как на тракторе пашу. | |
| |
|
|
| |
|
|
| |
для: DJ Paltus
(28.04.2009 в 12:04)
| | | Не слушайте никого, особоенно первого прокомментировавшего, он краб походу полный.
вот Вам функция
<script type="text/javascript">
/* -------------------------- */
/* XMLHTTPRequest Enable */
/* -------------------------- */
function createObject() {
var request_type;
var browser = navigator.appName;
if(browser == 'Microsoft Internet Explorer'){
request_type = new ActiveXObject('Microsoft.XMLHTTP');
} else {
request_type = new XMLHttpRequest();
}
return request_type;
}
var http = createObject();
/* -------------------------- */
/* SEARCH */
/* -------------------------- */
function searchNameq() {
var nocache = Math.random();
http.open('get', ' part_d1.html?nocache = '+nocache);
http.onreadystatechange = searchNameqReply();
http.send(null);
}
function searchNameqReply() {
if(http.readyState == 4){
var response = http.responseText;
$("#d1").html(response); // или через стандартную ява ф-цию document.getElementByid('d1').innerHTML=response;
}
}
</script>
|
по онклику вызываете searchNameq();
должена быть установлена jquery.js | |
| |
|
|
|
