ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
16 сообщений из 16, страница 1 из 1
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830722
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
Хочу сделать следующее: при выборе пункта (закладки) показывался соответствующий ассоциированный с выбранной закладкой скрытый слой, а остальные слои прятались. Наподобие PageControl в Delphi.
Написал HTML и скрипт, в FireFox и Chrome всё работает как задумано, а в Internet Explorer работает частично.
Ниже скрипт условно разделил на две части, вторая часть в IE не выполняется.
В консоли ошибок фаирфокса пусто.
 
скрипт
Код: javascript
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.
<script type="text/javascript">
function FocusTab(Tab) 
{
  /*  1-я часть скрипта (меняем стиль самой закладки ... обычная или активная) */
  var TabList=Tab.parentNode.parentNode.childNodes;
  for (var i=0;i<=TabList.length-1 ;i++)
  {	  var el=TabList[i];
	  if (el==Tab.parentNode)
	  {el.className="FocusedTab";  var x=i; }
	  else { el.className=""; }
  }
  
  /* 2-я часть скрипта (отображаем или скрываем нужный слой в соответствии с выбранной закладкой ) */
  TabList=Tab.parentNode.parentNode.parentNode.childNodes;
  for (i=0;i<TabList.length-1;i++)
  {
	el=TabList[i];
	if (el.id=="tabcont")
	{
		TabList=el.childNodes;
	    for (i=0;i<TabList.length-1;i++)
	    {
			el=TabList[i];
     		if (el.className=="cont")
			{
			    {el.style.display=(i==x)?'block':'none'}
		    }
	    }
	}
  }
}
</script>

 
HTML
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
<div>
  <ul id="tabnav">
	<li class="FocusedTab"><a href="javascript:void(0)" onclick="FocusTab(this)">TAB № 1</a></li>
	<li class=""><a href="javascript:void(0)" onclick="FocusTab(this)">TAB № 2</a></li>
	<li class=""><a href="javascript:void(0)" onclick="FocusTab(this)">TAB № 3</a></li>
	<li class=""><a href="javascript:void(0)" onclick="FocusTab(this)">TAB № 4</a></li>
  </ul>
  <div id="tabcont">
    <div class="cont" style="display:block">TAB № 1</div>
    <div class="cont" style="display:none">TAB № 2</div>
    <div class="cont" style="display:none">TAB № 3</div>
    <div class="cont" style="display:none">TAB № 4</div>
  </div>
</div>

Понимаю, что скрипт написан по-быдлокодовски, впервые пишу на яваскрипт, спасибо w3schools.com, но на большее меня пока не хватило. Помогите написать правильно
...
Рейтинг: 0 / 0
08.06.2012, 11:32:32
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830740
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
явас криптусвторая часть в IE не выполняется.
В консоли ошибок фаирфокса пустоа в консоли IE ?
...
Рейтинг: 0 / 0
08.06.2012, 11:38:12
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830775
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
а она там есть ? я не в курсе.
у меня IE 8, нашел "Средства разработчика F12", но ошибок не вижу.
...
Рейтинг: 0 / 0
08.06.2012, 11:52:27
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830804
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
http://blog.prabir.me/post/Javascript-debugging-in-IE8-with-console.aspx
...
Рейтинг: 0 / 0
08.06.2012, 11:59:05
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830866
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
Паганель,

хотел написать в дебагере console.info а он не редактируется. Написал блокноте - вот теперь в дебагере ошибка: 'console'- определение отсутствует. Этого достаточно, дальше разбираться нет желания.

Слушайте, мне не нужно постигать все тонкости, не собираюсь становиться гуру.
Просто хочу ПРАВИЛЬНО освоить азы.

Скрипт, который я тут привел, достаточно прост, чтобы опытному глазу увидеть ошибки, а также посоветовать как переписать, чтобы было кроссбраузерно
...
Рейтинг: 0 / 0
08.06.2012, 12:22:28
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830972
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
У меня в IE9 Ваш код работает
http://jsfiddle.net/nfnkg/

8-го IE у меня нет, увы ничем больше помочь не могу
...
Рейтинг: 0 / 0
08.06.2012, 13:03:37
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37830990
mage.lan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mage.lan
Участник
явас криптусСлушайте, мне не нужно постигать все тонкости, не собираюсь становиться гуру.
Просто хочу ПРАВИЛЬНО освоить азы.

Тогда возьмите jQuery и не парьте людям мозг.
Я вижу, что вы пытаетесь вычитать класс у нод неопределенного типа, читайте зачем люди делают проверки (node.nodeType === 1).
Этого достаточно, дальше разбираться нет желания. (с) Ваш.
...
Рейтинг: 0 / 0
08.06.2012, 13:11:53
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37831214
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
mage.lanТогда возьмите jQuery и не парьте людям мозг.
Я вижу, что вы пытаетесь вычитать класс у нод неопределенного типа, читайте зачем люди делают проверки (node.nodeType === 1).
Этого достаточно, дальше разбираться нет желания. (с) Ваш. Ваш мозг, Вам и беречь его.
jQuery - вот поэтому Вам нечего посоветовать. Опять же Ваш мозг. (с) Мой.
А проверка nodeType ничего не изменила.
...
Рейтинг: 0 / 0
08.06.2012, 14:52:13
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37831220
Фотография Паганель
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Паганель
Участник
явас криптусмне не нужно постигать все тонкости, не собираюсь становиться гуруучитывая это, я тоже голосую за использование jQuery для этой задачи
...
Рейтинг: 0 / 0
08.06.2012, 14:54:18
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37831278
Фотография iConst
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
iConst
Участник
Паганельявас криптусмне не нужно постигать все тонкости, не собираюсь становиться гуруучитывая это, я тоже голосую за использование jQuery для этой задачиИли освоить перевод денег на чужую карточку... :)
...
Рейтинг: 0 / 0
08.06.2012, 15:19:04
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37831290
Фотография Ex_Soft
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Ex_Soft
Участник
Код: javascript
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.
function FocusTab(Tab) 
{
  /*  1-я часть скрипта (меняем стиль самой закладки ... обычная или активная) */
  var TabList=Tab.parentNode.parentNode.childNodes;
  for (var i=0;i<=TabList.length-1 ;i++)
  {	  var el=TabList[i];
	  if (el==Tab.parentNode)
	  {el.className="FocusedTab";  var x=i; }
	  else { el.className=""; }
  }
  
  /* 2-я часть скрипта (отображаем или скрываем нужный слой в соответствии с выбранной закладкой ) */
  TabList=Tab.parentNode.parentNode.parentNode.childNodes;
  for (i=0;i<TabList.length-1;i++)
  {
	el=TabList[i];
	if (el.id=="tabcont")
	{
		TabList=el.childNodes;
	    for (i=0;i<TabList.length-1;i++)
	    {
			el=TabList[i];
     		if (el.className=="cont")
			{
			    {el.style.display=(i==x)?'block':'none'}
		    }
	    }
	}
  }
}



P.S. И не экономьте на переменных: во "2-я часть скрипта" у Вас цикл по i по TabList, которые Вы внутри переприсваиваете со всеми вытекающими...
...
Рейтинг: 0 / 0
08.06.2012, 15:25:41
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37831763
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
Ex_Soft,

спасибо! я же говорил, что опытный глаз сразу увидит ошибки :)
-1 по делфийской привычке повтыкал, не обратив внимания на условие i< ...
...
Рейтинг: 0 / 0
08.06.2012, 19:16:26
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37832464
mage.lan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mage.lan
Участник
явас криптусjQuery - вот поэтому Вам нечего посоветовать.
Молодой человек, прежде чем агрится, вы бы лучше голову включили. Скажите спасибо не ленивому Ex_Soft, который посмотрел на вашу ерунду под дебагером. И еще раз после "мне не нужно постигать все тонкости" отвечать вам охоты нет. То? на что вам указали это лишь кусок айсберга. RTFM DOM
явас криптусА проверка nodeType ничего не изменила.
Че правда что-ли? А кто орал про кросбраузерность? У вас хром на компе есть?
...
Рейтинг: 0 / 0
09.06.2012, 11:48:04
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37832684
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
явас криптусХочу сделать следующее: при выборе пункта (закладки) показывался соответствующий ассоциированный с выбранной закладкой скрытый слой, а остальные слои прятались... Помогите написать правильно
Код: html
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.
<!DOCTYPE HTML>
<html>  
<head>  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>  
  <style>
    .navigation-tab.selected .navigation-link { color: Green; }
  </style>
</head>
<body>
  <div>
    <ul id="navigation">
      <li class="navigation-tab selected">
        <a class="navigation-link" data-content="#pageOne" href="javascript:void(0)">TAB № 1</a>
      </li>
      <li class="navigation-tab">
        <a class="navigation-link" data-content="#pageTwo" href="javascript:void(0)">TAB № 2</a>
      </li>
      <li class="navigation-tab">
        <a class="navigation-link" data-content="#pageThree" href="javascript:void(0)">TAB № 3</a>
      </li>
      <li class="navigation-tab">
        <a class="navigation-link" data-content="#pageFour" href="javascript:void(0)">TAB № 4</a>
      </li>
    </ul>
    <div id="content">
      <div class="content-page" id="pageOne" style="display:block">TAB № 1</div>
      <div class="content-page" id="pageTwo" style="display:none">TAB № 2</div>
      <div class="content-page" id="pageThree" style="display:none">TAB № 3</div>
      <div class="content-page" id="pageFour" style="display:none">TAB № 4</div>
    </div>
  </div>
  <script>
    $('#navigation').on('click', '.navigation-link', onNavigationClick);    
    
    function onNavigationClick(event) {
      // Снимаем выделение с закладок и прячем контент
      $('.navigation-tab.selected').removeClass('selected');
      $('.content-page').hide();
      
      // Выделяем нужную закладку и отображаем соотв. контент
      $(this).closest('.navigation-tab').addClass('selected');
      $($(this).data('content')).show();
    }
  </script>
</body>
</html>


На что обратить внимание:
1. именование идентификаторов и классов элементов;
2. делегирование события click вместо навешивания обработчика на каждый элемент A;
3. закладки ассоциируются с контентом через атрибут, значение которого содержит конкретный идентификатор.
...
Рейтинг: 0 / 0
09.06.2012, 13:49:42
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37832773
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
skyANA,

большое спасибо! все советы учту.
...
Рейтинг: 0 / 0
09.06.2012, 14:48:34
| Ответить | Цитировать | Написать  
Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
    #37832781
явас криптус
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
явас криптус
Гость
mage.lanявас криптусjQuery - вот поэтому Вам нечего посоветовать.
Молодой человек, прежде чем агрится, вы бы лучше голову включили. Скажите спасибо не ленивому Ex_Soft, который посмотрел на вашу ерунду под дебагером. И еще раз после "мне не нужно постигать все тонкости" отвечать вам охоты нет. То? на что вам указали это лишь кусок айсберга. RTFM DOM
явас криптусА проверка nodeType ничего не изменила.
Че правда что-ли? А кто орал про кросбраузерность? У вас хром на компе есть?Сколько уже было сказано: нет охоты - не отвечайте! Кто заставляет ? Зачем нарисовались ?
Зачем мне постигать все тонкости ? Яваскрипт мне понадобился в первый и возможно в последний раз.
Хром есть (вы не внимательно читаете), в нем всё работает и в консоли ошибок нет.
...
Рейтинг: 0 / 0
09.06.2012, 14:51:10
| Ответить | Цитировать | Написать  
16 сообщений из 16, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Первое не совсем удачное знакомство с javascript. Посоветуйте с обходом дома
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=37830722&tid=1449714]:
 0ms
get settings:
 8ms
get forum list:
 16ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 65ms
get topic data:
 7ms
get forum data:
 2ms
get page messages:
 44ms
get tp. blocked users:
 1ms
others: 201ms
total:  350ms
созд. / загр.: 350ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]