Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Вывод html файла в текущий по клику на ссылку

Автор: madrus13 23.7.2009, 16:00

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

Есть ссылки на странице index.php, и  файлы с содержимым по  ссылкам. Внутри одного из полей index.php должно выводится содержимое одного из файлов  по умолчанию, если нажимают на другую ссылку - в это поле выводится соответственно другой файл.
Должно выводится как функцией php include(), т.е. форматированно.

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

Можно  ли сделать  такое: при нажатии onclick javascriptом создать переменную с определенным кодом, а в том поле проверить переменную и вывести форматированный текст взяв его из файла.

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

Автор: WebDisaster 23.7.2009, 16:23

Цитата(madrus13 @ 23.7.2009, 16:00

)

Какую технологию лучше использовать

Наверно Ajax =)

Автор: Avreol 24.7.2009, 20:43

php скриптом никак так не сделаешь ибо он исполняется на сервере
я делал очень криво но все же))

Код


<script type='text/javascript'>
    function change(){
        document.getElementById('hehe').innerHTML = document.getElementById('hoho').innerHTML;
    }
</script>

<div id='hoho' style='width: 1px; height: 1px; visibility: hidden'>твой файл</div>

<a href='#' onclick='change()'>ссылко</a>
<div id='hehe'>что то</div>

а вообще конечно прав верхний оратор, ajax тебе нужен

Автор: skyboy 25.7.2009, 00:39

подгрузку по событию(клик) в один элемент данных извне(из другого элемента или с сервера) делать надо при помощи javascript'a.
если самописно - то полезно для учения.
можно воспользоваться готовой библиотекой. к примеру, с использованием http://docs.jquery.com/Main_Page нужное будет выглядеть так:

Код


<div id="content">
содержимое по умолчанию
</div>
<a href="http://forum.vingrad.ru/forum/topic-267599.html" onclick="jQuery('#content').load(this.href); return false;">ссылка</a>

замечу по ньюансам: во-первых, дико желательно, чтоб ссылка вела на тот же контент, который тебе надо вставить(чтоб в случае отключенного javascript'a не было полного конфуза - уж лучше человек получит данные без подключенных CSS или даже без графики, но получит). чтоб в каждом onclick не копировать-вставлять соотвествующий url, я использую конструкцию this.href в обработчике.
кроме того, framework(в данном случае - jquery) позволит не писать отдельный обработчик на каждую ссылку:

Код


<div id="content">
содержимое по умолчанию
</div>
<a href="http://forum.vingrad.ru/forum/topic-267599.html" class="load_content">Вывод html файла в текущий по клику на ссылку</a>
<a href="http://forum.vingrad.ru/forum/topic-267523.html" class="load_content">Требуется WEB-ДИЗАЙНЕР</a>
<script type="text/javascript">
jQuery('a.load_content').bind('click', function(jQuery('#content').load(this.href);) ); 
// разом привязали обработчики ко всем <A> с классом "load_content"
</script>

однако, замечу: если ты собираешься подгружать данные со своего же сайта, а не тыритьбрать данные со стороннего сайта, то тебе, конечно, хотелось бы, чтоб твой контент(и динамически подгружаемый в том числе) индексировался поисковиками. И вот сюрприз: то, что ты подгружаешь динамически посредством ajax не индексируется - поисковики не выполняют javascript.
потому предлагаю следующее: при формировании страницы запихиваешь в неё все необходимое содержимое по блоками и средствами javascript делаешь не подзагрузку, а отображение одного из блоков и скрытие остальных. правда, придется решать проблему верстки - чтоб до момента выполнения javascript'a, который скроет после загрузки все блоки за исключением одного, блоки эти не расперли страницу вусмерть и не напугали посетителя smile