Можно ли создать "дочерный" html-файл?

[pudge]

Код главной страницы сайта и так немаленький,а мне предстоит его ещё увеличить.

 

На странице есть один елемент,задача которого - открывать вкладку с контентом,вот код одной из вкладок:

iMstup[0]="<div id='view1'><h1>Ололоша 1</h1></div>";

как видите в середине этой вкладки находится тестовый контент,но вот проблема в том что если закрывающий </div> опустить на следующюю строку то ВЕСЬ скрипт перестанет работать(непойму почему так).Вот весь скрипт целяком:

<script src="JS/jquery.min.js"></script> <script> 	var iMstup= new Array();iMstup[0]="<div id='view1'><h1>Ололоша 1</h1></div>";iMstup[1]="<div id='view2'><h1>Ололоша 2</h1></div>";   $('.tab').bind("click",function(){   var num = ["first","second","third"],   id = $(this).index(),   currentTemplate = iMstup[id];   $('#content').html(currentTemplate);    }) </script>

Я сначала хотел прописывать контент  в этой же вкладке iMstup[0]="<div id='view1'><h1>Ололоша 1</h1></div>"; напрямую,тоесть сотни строк html кода.Но потом осознал что будет очень сложно и неудобно работать с таким файлом и подумал "вот было бы здорово создать дочерний файл",ну на месте Ололоша 1 разместить ссылку на хтмл файл а в самом файле уже прописывать контент(тонны кода),ну как в Си.

 

Я пытался узнать у гугла "как создать дочерный html файл",но он посмотрел на меня как на дурачка и не выдал ниодной ссылки

 

Если нельзя осуществить что то подобное то хотябы скажите почему нельзя переносить закрывающий div на следующюю строку,а то писать это все в одной строке - сумашествие.

 

 

Зарание спасибо за ответы!!!

[Николя223]

так то - это твой код)) то что просил - то и получил))) под свои нужды подстраивай

 

опера какая ? проверил в 18 и 12.16 всё работает

[pudge]

так то - это твой код)) то что просил - то и получил))) под свои нужды подстраивай

 

опера какая ? проверил в 18 и 12.16 всё работает

 

Версия:

12.15

Сборка:

1748

Платформа:

Win32

Система:

Windows XP

все,работает в опере

[pudge]

так то - это твой код)) то что просил - то и получил))) под свои нужды подстраивай

 

 

Первая кнопка не работает,а вторая открывает контент в котором "Кликни" которое не кликается...

 

В общем вот вырезал весь кусок кода ибо я не могу уже понять где проблема:

<ul id="switcher">    <li class="tab"><div class="tab1"><img src="img/tab1.png" alt="" /></div></li>    <li class="tab"><div class="tab1"><img src="img/tab2.png" alt="" /></div></li></ul> <div id="tab0"><span id="chooseVIEW">выберите вид...</span></div> <div id="content"></div></div> <script> 	var iMstup= new Array();	iMstup[0]="<div id='view1'><a class='add'>Кликни</a><div class='add'></div></div>";	iMstup[1]="<div id='view2'><h1>Ололоша 2</h1></div>";   $('.tab').bind("click",function(){   var num = ["first","second","third"],   id = $(this).index() - 1,   currentTemplate = iMstup[id];       //alert(id)   $('#content').html(iMstup[id]);}) </script><script>$('.add').live("click",function(){$(this).load('add.htm');    return false;});</script>

[Николя223]

http://jsfiddle.net/dkm63/

[pudge]

http://jsfiddle.net/dkm63/

 

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

 

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

var link= ["/XDT4G/ #run","/sfD2y/"];

но я попробовал,не работает,либо я не правильно её разместил(мб слеша какогото нехватило)

 

 

З.Ы.ваш пример на джфиддл жудко лагает во время переключения кнопок,причем и в хроме и в опере,но не на моем тестовом сайте,но это наверное потому что там не работает 1я кнопка

Edited November 21, 2013 by pudge

[Switch74]

я запутался уже в теме ....

 

1. вижу табы

<ul id="switcher">    <li class="tab"><div class="tab1"><img src="img/tab1.png" alt="" /></div></li>    <li class="tab"><div class="tab1"><img src="img/tab2.png" alt="" /></div></li></ul>

2. вижу место, куда должен загружаться контент

 <div id="content"></div>

3. не пойму зачем это и отсутствие открывающего тега <div>,

 <div id="tab0"><span id="chooseVIEW">выберите вид...</span></div>...</div>

но это думаю не важно

 

4. дальше смотрим на скрипт

 <script>  var iMstup= new Array();iMstup[0]="<div id='view1'><a class='add'>Кликни</a><div class='add'></div></div>";iMstup[1]="<div id='view2'><h1>Ололоша 2</h1></div>";   $('.tab').bind("click",function(){   var num = ["first","second","third"],   id = $(this).index() - 1,   currentTemplate = iMstup[id];       //alert(id)   $('#content').html(iMstup[id]);}) </script>

iMstup[0]="<div id='view1'><a class='add'>Кликни</a><div class='add'></div></div>";iMstup[1]="<div id='view2'><h1>Ололоша 2</h1></div>";

этот огрызок я так понимаю имеет массив наших контентных частей, которые должны загружаться при нажатии на табы

и вы хотите еще, чтобы в эти загружаемые контенты еще что-нибудь подгружалось через аякс и вставлялось вместо

<a class='add'>Кликни</a><div class='add'></div>

а не проще в подгружаемый файл вынести

<div id='view1'>нужная контентная часть</div>

тогда не нужны будут эти мороки с двойной обработкой js и тормозить перестанет

[pudge]

Switch74 все правильно написали,но в конце вы написали что то невразумительное

 

 

 

 

а не проще в подгружаемый файл вынести

<div id='view1'>нужная контентная часть</div>

 

Я не понял что вы имели ввиду,точнее я сначала подумал что вы хотите даунную строку вместе с контентом разместить внутри подгружаемого файла,но это как то.... непонятно чтоли,что тогда в iMstup[0] = "" будет?

[Switch74]

В текущем варианте кода получается так:

1. в зависимости от нажатой таб у нас подгружается код из js, например при нажатии на первый таб грузим

iMstup[0]="<div id='view1'><a class=add>add</a><div class=add></div></div>";

2. дальше мы жмем на подгруженную ссылку и заменяем подгружаемым вариантом из add.htm

$('.add').live("click",function(){$(this).load('add.htm');return false;

получается <div id='view1'><a class=add>"содержимое файла add.htm"</a><div class=add></div></div>

а хотелось <div id='view1'>"содержимое файла add.htm"</div>

для этого нужно исправить на $(this).parent().load('add.htm');

 

 

теперь момент - нужно ли это все, не проще ли:

сделать для табов точно такую же загрузку из файла?

$('.tab1').live("click",function(){$(this).load('add1.htm');return false;

индекс у tab можно сделать динамическим или использовать дополнительный параметр в теге как ключ для указания какой файл подгружать. Вариантов выше крыши все ограничено только вашим воображением.

 

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

Edited November 26, 2013 by Switch74

[pudge]

теперь момент - нужно ли это все, не проще ли:

сделать для табов точно такую же загрузку из файла?

$('.tab1').live("click",function(){$(this).load('add1.htm');return false;

стоп стоп стоп,а зачем это? "сделать для табов точно такую же загрузку из файла" зачем для табов делать это?с табами(кнопками)все путем.

 

Я сделал вроде все правильно,но на месте контента(первого)пустота,просто вакуум,но таб работает и как бы контент открывает,по крайней мере border виден(и больше ничего).

 

Я все беспокоюсь по поводу самого файла в котором код контента должен быть,я почемуто уверен что там не может быть все так просто,вот что внутри add.htm:

 

 

<html>

dddddddds

</html>

[Switch74]

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

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

Edited November 28, 2013 by Switch74

[pudge]

 

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

 

Цель этих табов в том что бы показывать 2 вида контента,зачем подгружать из другого файла код?ну я подумал что впихивать пару сотен строк кода на главной странице в iMstup[0]="<div id='view1'>контент</div>"; будет плохой затеей,но я уже гдето 80 засунул,в конце каждой строки приходится писать обратный слеш так как без него небудет работать так как весь код контента находится в скрипте,ну и если какойто из табов перестанет работать то нужно будет искать среди этих сотен строк где именно нехватает обратного слеша....

[Switch74]

так я вам и предлагаю не пихать туда ни строчки, а все это запихать в отдельный файл, раз вы его все равно будете грузить

[pudge]

так я вам и предлагаю не пихать туда ни строчки, а все это запихать в отдельный файл, раз вы его все равно будете грузить

 

ну вообщето,пока я делаю все правильно и без ошибок - скрипту ничего не угрожает,пусть я хоть  3000 строк контента туда засуну - оно будет нормально работать,но с другой стороны мне всеравно как то не по себе,поэтому и придумал я эту затею с подгрузкой кода из доп. файла,но я попробовал сделать как в ваших примерах но не работает(я уже писал выше),и менял на $(this).parent().load('add.htm'); но всеравно,сколько изменений было,а эффект один - контента на первом табе(где должен располагатся контент add.htm) - нету.

[Switch74]

Вот что-то вроде:

<style></style><script>$(document).ready(function(){   var tab = document.location.hash;   tab = Number(tab.replace(/\D+/g,""));   load_content(tab);   $('.tab').live('click',function(){        var href = $(this).attr('href');      document.location.href = href;        href = Number(href.replace(/\D+/g,""));        load_content(href);   });});function load_content(id){   $('.content').load('tab'+ id +'.htm');}</script><a href="#tab1" class="tab">tab1</a> | <a href="#tab2" class="tab">tab2</a><div class="content"></div>

идея ясна?

если это у тебя не работает, значит тебе категорически нельзя заниматься программированием

[pudge]

Оно то работает,но неуверен что именно так оно выглядит и у вас,можете залить на jsfiddle?

 

Разве в строке $('.content').load('tab'+ id +'.htm'); все так и должно быть?Настораживает то что там одно расширение без имени файла.

[Switch74]

('tab'+ id +'.htm')

в скобочках имя файла, например для tab1 оно tab1.htm для tab2 - tab2.htm, а если захочется по умолчанию вставить какой-то контент, если не нажат ни один из табов, то создаем tab0.htm

[pudge]

вот сейчас пересмотрел тему целяком,ужс,помоему мы далеко зашли,слишком усложнили все

 

('tab'+ id +'.htm')

 

почему в скобках просто не сделать вот так ('add.htm')?Зачем туда вмешивать таб который вообще не должен иметь ко всему этому никакого отношения,зачем было переделывать весь скрипт...

 

Допустим я бы задал другой вопрос:

 

Как в простом примере создать подгрузку кода контента в код страницы?

 

Например так:

<html><body><div id='content'>в это место должен подгружатся код из файла блаблабла.htm</div></body></html>

Не думаю что для такой задачи потребовался весь тот огромный код из вашего поста #40

 

Я спрашивал с помощью чего можно провернуть такую задачу,задайте направление и я сам попробую разобратся в том как осуществить задуманое

Edited December 1, 2013 by pudge

[Switch74]

1. мой скрипт не больше вашего, сравните их построчно

2. мой скрипт поддерживает загрузку таба исходя из хэша адреса, т.е. каждый таб имеет свой адрес который можно передать другому человеку и он увидит именно то, что вы хотели показать, у вас же всегда грузится таб по умолчанию (возможно это вам и не нужно, пол кода можно будет вырезать)

3. если в скобках просто сделать add.htm, то при открытии любого таба у вас будет грузиться одно и то же, если вам это нужно, делайте так.

4. для просто загрузки контента в блок js средствами или php?

php достаточно

<html><body><div id='content'><?php include "add.htm";?></div></body></html>

js если без кнопки, подгрузки jquery, только на чистом js через ajax, то почитайте тут, если разберетесь то у вас все получится

[pudge]

 

4. для просто загрузки контента в блок js средствами или php?

php достаточно

<html><body><div id='content'><?php include "add.htm";?></div></body></html>

 

Ну вот добавил:

iMstup[0]="<div id='view1'><?php include 'add.htm';?></div>";

Но всеравно не работает,пустота на том месте...

 

З.Ы.заменил двойные кавычки на апострофы,но я думаю это не стало причиной нерабочего php-кода верно?

[Switch74]

можно в '...' и "..." вы смотрите в инете или на локальном web сервере? Если в инете дайте ссылку.

Возможно у вас не верный путь до файла add.htm, где он лежит и где лежит html в который он должен подгрузиться?

[pudge]

 

Возможно у вас не верный путь до файла add.htm, где он лежит и где лежит html в который он должен подгрузиться?

 

add.htm лежит в той же папке что и index.html вот посмотрите на код http://historyofdota.info/ нажмите на первый таб(зеленая "1")и посмотрите код открывшейся вкладки(view1).

 

З.Ы.не обращайте внимания на срач,это мой личный "полигон для испытаний"

[rpmcmerphy]

Пудж хукай )

[pudge]

Пудж хукай )

 

вчера хукнул)))меня даже сфоткали 

[Switch74]

1. При нажатии по первому табу у вас грузится 

<!--?php include 'add.htm';?-->

Вы это куда вставили? 

PHP вставили в html файл, а на сервере настроили обработку php в html?

начните с основ, разберитесь что куда и как нужно сувать.

 

2. у вас там реально бред, и как вы хотите разобраться в этой каше?

Начинайте с простого, а потом усложняйте.

[pudge]

 

PHP вставили в html файл, а на сервере настроили обработку php в html?

 

 

нет,а как это сделать?