Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.91/97: Рейтинг темы: голосов - 97, средняя оценка - 4.91
252 / 8 / 0
Регистрация: 12.11.2009
Сообщений: 170
1

Чем заменить фрейм?

14.11.2009, 05:11. Просмотров 18312. Ответов 17
Метки нет (Все метки)


Доброго времени суток всем.
Вот понемногу "собираю" сайт(так сказать, учусь). И появилась такая непростая задача:
- есть "шапка" у страницы;
- сбоку менюшка.
Как сделать так, чтобы при переходе по меню, менялась не вся страница, а только там, где надо менять текст, т.е. определьный блок, похоже на фрейм, но немножко не то.
и что бы он мог прокручиаться до конца страницы общим скролингом, а не месным как это делает фрейм... Может немного не неправильно выразился, прошу прощения, я только начинаю "этим заниматься".
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
14.11.2009, 05:11
Ответы с готовыми решениями:

сма DAEWOO DWD M1029A чем заменить транс, трансформатор в обрыве, чем заменить
день добрый. модуль PN:361430A950 первичная транса в обрыве . может кто подскажет параметры ,...

В чате есть фрейм с юзерами, как по клику вставить имя юзера в другой фрейм?
Это делается для приватных сообщений, ну типа такого(окно чата): Stas => : вобщим кодить еще...

Чем можно заменить заменить toggle() ?
Добрый день, у меня такой вопрос. Чем можно заменить toggle(function(), function()); В ранних...

Чем заменить new на Си?
есть строчки кода, как их преобразовать в Си код? typedef struct CFind { int x, y, value; ...

17
701 / 572 / 59
Регистрация: 18.11.2008
Сообщений: 2,147
14.11.2009, 06:23 2
ajax тебе поможет
0
356 / 314 / 48
Регистрация: 21.04.2009
Сообщений: 574
14.11.2009, 12:31 3
я думаю PHP в этом вопросе лучщий помощник, недостаток в php хостинге...

Добавлено через 2 минуты
Цитата Сообщение от GаlаX Посмотреть сообщение
ajax тебе поможет
тоже не плох!!!
0
Почетный модератор
11171 / 4128 / 412
Регистрация: 12.06.2008
Сообщений: 11,970
14.11.2009, 13:22 4
Лучший ответ Сообщение было отмечено как решение

Решение

Даже PHP не нужен.
HTML5
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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
 
function PageRecive(s)
{
    document.getElementById('text').innerHTML=s;
}
 
var xmlHttp=false;
function AjaxCreate()
{
    if (xmlHttp) return true;
    /* Сначала попробуем создать XMLHttpRequest для голимого и глючного Internet Explorer */
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
    try {
        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e2) {
            xmlHttp = false;
        }
    }
    @end @*/
    /* А теперь, если у нас нормальный браузер, то создаём всё по-нормальному */
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined')
        xmlHttp = new XMLHttpRequest();
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
        d.write('<div style="font-size: 16pt; color: black;">Не удалось создать объект для работы с Ajax. Возможно, в вашем браузере выключен JavaScript или вы пользуетесь фиговым браузером. Рекомендую установить <b>Mozilla Firefox</b> или <b>Opera</b></div>');
        xmlHttp=false;
        return false;
    }
    return true;
}
 
function AjaxGet(url,callback)
{
    function UpdatePage()
    {
        if (xmlHttp.readyState==4) {
            callback(xmlHttp.responseText);
        }
    }
    if (!xmlHttp) AjaxCreate();
    xmlHttp.open('GET',url,true);
    xmlHttp.onreadystatechange=UpdatePage;
    xmlHttp.send(null);
}
 
</script>
</head>
<body>
<table><tr><td>
<a href="#" onclick="AjaxGet('page1.html',PageRecive); return false;">Меню 1</a><br />
<a href="#" onclick="AjaxGet('page2.html',PageRecive); return false;">Меню 2</a><br />
<a href="#" onclick="AjaxGet('page3.html',PageRecive); return false;">Меню 3</a><br />
</td><td>
<div id="text">Тут будет содержимое подгружаемых страниц</div>
</td></tr></table>
</body>
</html>
При нажатии на разные меню, внутрь тега <div id="text"> будут загружаться страницы page1.html и т.п.
4
252 / 8 / 0
Регистрация: 12.11.2009
Сообщений: 170
14.11.2009, 15:49  [ТС] 5
Всем откликнувшимся большое спасибо, особенно Humanoid.
И еще вопросик, при таком скрипте, будет грузиться только текст, но и может еще и картинки?
И где можно почитать по подробнее про ajax?
0
Почетный модератор
11171 / 4128 / 412
Регистрация: 12.06.2008
Сообщений: 11,970
14.11.2009, 16:46 6
Цитата Сообщение от Columb Посмотреть сообщение
И еще вопросик, при таком скрипте, будет грузиться только текст, но и может еще и картинки?
Если в этом тексте, который ты подгружаешь будут теги <img>, то и картинки загрузятся.

Цитата Сообщение от Columb Посмотреть сообщение
И где можно почитать по подробнее про ajax?
Кажется, я отсюда узнал.
2
1953 / 792 / 89
Регистрация: 03.11.2009
Сообщений: 3,066
Записей в блоге: 2
14.11.2009, 20:34 7
спасибо,распечатал))очень полезный сайтик)буду туда наведываться))
0
Fliperson
28.07.2010, 00:09 8
Здравствуйте. Очень помог ваш пост. Спасибо! У меня вопрос. Как сделать так, что бы не только главное меню так подгружало страницы? Т.е. например, Главная ---Интернет-магазин
---аудио
---видео
---диски
нажимаешь на "аудио" и разделы страницы так же подгружаются. А с разделов дальше...
В общем, как сделать так, что бы
HTML5
1
<a href="#" onclick="AjaxGet('page1.html',PageRecive); return false;">Меню 1</a><br />
прописалось автоматически для каждой новой или уже существующей ссылки? Примерно так. Не могу объяснить по-другому. Простите. Можете посмотреть [ссылка удалена] и поймёте, что я хочу. Это НЕ спам! Мне от этих посещений ни холодно ни жарко. Спасибо
17 / 17 / 5
Регистрация: 13.02.2011
Сообщений: 107
13.02.2011, 17:53 9
А как сделать чтобы вместо "Тут будет содержимое подгружаемых страниц" загружалась нужная страница по умолчанию?

Добавлено через 24 минуты
Так, я уже разобрался, сделал вот так: <body onload="AjaxGet() ..........................
0
28 / 28 / 4
Регистрация: 18.05.2010
Сообщений: 266
13.02.2011, 18:14 10
Народ, Joomla решает эту задачу. Кроме того, что вы делаете только один файл-шаблон и при переходе по ссылкам меню меняется или одно или сколько нужно модулей вы имеете еще массу преимуществ. В частности, возможность подключения множества эффектов, а если сайт будет для заказчика, то он сможет сам редактировать тексты на страницах и добавлять/удалять изображения через визуальный редактор подобно набору текста в обычном ворде.
0
64 / 64 / 20
Регистрация: 16.07.2012
Сообщений: 147
28.09.2013, 14:54 11
Humanoid, подскажите пожалуйста, как решить мою проблему.
Я воспользовался вашим скриптом, body onload грузит в index страничку приветствия. На новостной страничке (тоже подгружаемой) можно добавить пост с помощью php, но после выполнения php я хочу вернуться назад и чтобы была подгружена новостная страничка, а не страница приветствия.
Не могу ничего придумать лучше чем,
PHP
1
header("location: ".$_SERVER['HTTP_REFERER']);
Это вернет меня в index с подгруженной страничкой приветствия, а нужна новостная страница.
0
Почетный модератор
11171 / 4128 / 412
Регистрация: 12.06.2008
Сообщений: 11,970
28.09.2013, 18:45 12
polyaKIDze, я тут вижу два пути:
1) (и на мой взгляд наиболее подходящий) можно использовать такой же ajax, но с post запросами. Тогда при добавлении сообщения (или что там делает пользователь) у него вообще не будет меняться страница. Я бы посоветовал использовать jQuery для этого... тот скрипт из 4 сообщения я привёл когда ещё сам не был знаком с более удобным и отлаженным jQuery. Там это будет что-то вроде:
Javascript
1
2
3
4
5
$.post('/addmessage.php',
  {
    nom: 123,
    msg: 'Ляляля',
  })
Этот javascript сделает тоже самое, что и отправка из формы:
HTML5
1
2
3
4
5
<form action="/addmessage.php" method="post">
<input type="text" name="nom"/>
<input type="text" name="msg"/>
<input type="submit"/>
</form>
Разница будет только в том, что в случае с javascript страница не будет обновляться... для пользователя ничего заметного не произойдёт. Надо будет только так же через javascript дать пользователю понять, что его команда была выполнена.

2) Можно возвращаться не просто на
PHP
1
header("location: ".$_SERVER['HTTP_REFERER']);
а на какой-нибудь
PHP
1
header("location: ".$_SERVER['HTTP_REFERER']."?page=news");
А при загрузке уже проверять, чему равен $_GET['page']... и если он равен 'news', то сразу подгружать новостную страничку.
3
64 / 64 / 20
Регистрация: 16.07.2012
Сообщений: 147
28.09.2013, 19:57 13
Humanoid, спасибо вам большое.
Я все же воспользовался вторым вариантом, т.к. js я знаю чуть меньше, чем никак. Стыдно, что сам не додумался до такого решения. Конечно подгрузка видна, но поначалу пойдет.
Первый вариант тоже попробовал, но что-то даже так не сработало:
HTML5
1
2
3
4
5
6
7
8
<!-- index.html -->
<script>
    $.post('addnews.php',
    {
        themeOfNews: '12.12.12',
        textOfNews: 'Ляляля',
    });
</script>
PHP
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//addnews.php
<?php
    if (isset($_POST['textOfNews'])) { 
        $text = "<em><p>".$_POST['textOfNews']."</p></em>";
    }
    if (isset($_POST['themeOfNews'])) { 
        $theme = "<p align=\"center\"><big><strong>".$_POST['themeOfNews']."</strong></big></p>";
    }
    if (($text != '') and ($theme != '')) {
        $file = fopen("new.txt", "rt");
        $old = fread($file, filesize("new.txt"));
        fclose($file);
        $file = fopen("new.txt", "wt");
        fwrite($file, $theme."\n".$text."\n".$old);
        fclose($file);
    }
?>
Видать, чего-то важного я не знаю.
0
Почетный модератор
11171 / 4128 / 412
Регистрация: 12.06.2008
Сообщений: 11,970
30.09.2013, 09:36 14
Цитата Сообщение от polyaKIDze Посмотреть сообщение
Первый вариант тоже попробовал, но что-то даже так не сработало:
Надо вначале сам jQuery подгрузить... например
HTML5
1
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
0
0 / 0 / 0
Регистрация: 20.10.2014
Сообщений: 1
20.10.2014, 09:30 15
Я, конечно, понимаю, что Вы это писали уже давно. Но все же. я только начинаю осваивать javascript и не всегда могу сообразить в чем проблема при невыполнении тех или иных инструкций. Код, предложенный Вами, меня очень заинтересовал. Однако, в Хроме он почему-то не выполняется:

XMLHttpRequest cannot load page1.html. Cross origin requests are only supported for protocol schemes: http, data, chrome-extension, https, chrome-extension-resource. VM183 AJAX.html:52AjaxGet VM183 AJAX.html:52onclick VM184 AJAX.html:59
Uncaught NetworkError: Failed to execute 'send' on 'XMLHttpRequest': Failed to load
page1.html'. VM183 AJAX.html:52AjaxGet VM183 AJAX.html:52onclick

Дополнительный вопрос: При таком подходе, можно сразу выйти на страницу page1, набрав в адресной строке www.сайт.ru/page1.html ? и будет ли в таком случае загружено меню? А при переходе по ссылке "меню 1" адресная строка браузера никак не изменится и останется "сайт.ру" ?
Заранее извиняюсь за дилетантские вопросы.

Добавлено через 15 минут
Humanoid, и как передать в эту функцию id элемента? Если у меня такиъ элементов "text" на странице несколько "text1", "text2",... ???
0
0 / 0 / 0
Регистрация: 20.10.2014
Сообщений: 23
11.02.2015, 21:02 16
HTML5
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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
 
function PageRecive(s)
{
    document.getElementById('text').innerHTML=s;
}
 
var xmlHttp=false;
function AjaxCreate()
{
    if (xmlHttp) return true;
    /* Сначала попробуем создать XMLHttpRequest для голимого и глючного Internet Explorer */
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
    try {
        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e2) {
            xmlHttp = false;
        }
    }
    @end @*/
    /* А теперь, если у нас нормальный браузер, то создаём всё по-нормальному */
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined')
        xmlHttp = new XMLHttpRequest();
    if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
        d.write('<div style="font-size: 16pt; color: black;">Не удалось создать объект для работы с Ajax. Возможно, в вашем браузере выключен JavaScript или вы пользуетесь фиговым браузером. Рекомендую установить <b>Mozilla Firefox</b> или <b>Opera</b></div>');
        xmlHttp=false;
        return false;
    }
    return true;
}
 
function AjaxGet(url,callback)
{
    function UpdatePage()
    {
        if (xmlHttp.readyState==4) {
            callback(xmlHttp.responseText);
        }
    }
    if (!xmlHttp) AjaxCreate();
    xmlHttp.open('GET',url,true);
    xmlHttp.onreadystatechange=UpdatePage;
    xmlHttp.send(null);
}
 
</script>
</head>
<body>
<table><tr><td>
<a href="#" onclick="AjaxGet('page1.html',PageRecive); return false;">Меню 1</a><br />
<a href="#" onclick="AjaxGet('page2.html',PageRecive); return false;">Меню 2</a><br />
<a href="#" onclick="AjaxGet('page3.html',PageRecive); return false;">Меню 3</a><br />
</td><td>
<div id="text">Тут будет содержимое подгружаемых страниц</div>
</td></tr></table>
</body>
</html>
Почему то у меня не работает этот код, сделала файл index.html c кодом что выше, рядом положила три файла page1.html , page2.html , page3.html ...... для примера сделала все эти три страницы с разными цветами фона, по идее при нажатии на ссылки на странице должны появляться все эти три цвета...Но ничего не происходит. Помогите плиз.
0
0 / 0 / 0
Регистрация: 17.12.2015
Сообщений: 1
17.12.2015, 20:59 17
2kristinka707
Там по видимому есть зависимости от чегото) Ну к примеру если в page1 сделать краснй квадрат в теге wrapper, то перейдя по ссылке Меню1 - красный квадрат по явится, но содержимое в index сместится от левого и верхнего края(у меня гдето по 100пксл), если wrapper придать float-left, то смещение в index происходит только от левого края на величину около 100пкс.
Если на странице index, wrapper заменить дивом с класом которому задать ширину и высоту, то все получается нормально.

А мне больше интересно, если на подгружаемой странице в коде нет headera и прочего будет ли эта страница "достойно" индексироваться поисковиками?
0
0 / 0 / 0
Регистрация: 07.06.2015
Сообщений: 7
26.04.2018, 16:12 18
У меня такая же проблема была. Поставил все на хостинг, заработало.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
26.04.2018, 16:12

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь или здесь.

Чем заменить?
Чем заменить кондеры 100n в программатор на FT232RL? Ибо в трёх нигазах таких кондеров нет в любом...

Чем заменить symlink()?
Хотел сделать ссылку на папку, но на хостинге отключена функция PHP symlink(). Как можно обойтись...

Чем заменить Attiny13
На днях решил закупиться радиодеталями, а как оказалось нужную мне модель контроллера не так уж...

Чем заменить ORD?
program lab_7; uses crt; var Cлово : array of string; s,i, n, max : integer; begin clrscr;...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
18
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.