Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Написал функцию, а WebKit её не понимает (https://javascript.ru/forum/events/7633-napisal-funkciyu-webkit-ejo-ne-ponimaet.html)

Arkaim 12.02.2010 00:35

Написал функцию, а WebKit её не понимает
 
Здравствуйте, я только начал изучать JavaScript. И сразу же пришлось пробовать написать функцию, которая должна менять класс у элемента списка, тем самым достигается подсветка активного пункта меню. Принадлежность определяется по document.title. В Опере, Ослике 8 и Фоксе все работает замечательно, а в WebKit производных браузерах не хочет подсвечиваться активное меню, т.е. само меню формируется, но подсветка не работает. Из всех вариантов решения данного вопроса на JavaScript, заработал только этот. Привожу сам код:
в HTML:
<div id="mainmenu">
        <script type="text/JavaScript" src="/lib/tpl/mysite/js/mainmenu.js"></script>
</div>


Сама функция (для краткости привожу два пункта меню, всего их 6):
titArray = new Array()
			titArray [0] = "Главная [Мой сайт]"
			titArray [1] = "Блог [Мой сайт]"
			titArray [2] = "Проект [Мой сайт]"
			
			urlArray = new Array()
			urlArray [0] = "/start"
			urlArray [1] = "/blog"
			urlArray [2] = "/projects"
			
			mnuArray = new Array()
			mnuArray [0] = "<span>Главная</span>"
			mnuArray [1] = "<span>Блог</span>"
			mnuArray [2] = "<span>Проект</span>"
         
         var libegin = "<li>"
			var lnk1 = "<a href='"
			var lnk2 = "' class='unactive' target='_parent'>"
			var lnk22 = "' class='active' target='_parent'>"
			var lnk3 = "</a>" 
			var liend = "</li>"
		  document.write("<ul class='menu'>")
        if (document.title == titArray[0])
        {document.write(libegin+lnk1+urlArray[0]+lnk22+mnuArray[0]+lnk3+liend)}
        else
        {document.write(libegin+lnk1+urlArray[0]+lnk2+mnuArray[0]+lnk3+liend)}
        
        if (document.title == titArray[1])
        {document.write(libegin+lnk1+urlArray[1]+lnk22+mnuArray[1]+lnk3+liend)}
        else
        {document.write(libegin+lnk1+urlArray[1]+lnk2+mnuArray[1]+lnk3+liend)}

        if (document.title == titArray[2])
        {document.write(libegin+lnk1+urlArray[2]+lnk22+mnuArray[2]+lnk3+liend)}
        else
        {document.write(libegin+lnk1+urlArray[2]+lnk2+mnuArray[2]+lnk3+liend)}


Подскажите в чем может быть проблема? Возможно есть более элегантный вариант решения?

sergdev 12.02.2010 02:41

Может у вас проблема со стилями какая то , не думаю что проблема в джаваскрипте. Если вы будете любезны дать ссылку(на ваш работающий "скрипт/страницу"), то может посмотримс :)

Arkaim 12.02.2010 09:16

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

sergdev 12.02.2010 09:49

Хм. А как связано то, что они проходят валидацию с кроссбраузерностью ? Не вижу никакой связи. То что они соответствуют стандартам, не говорит о том, что они грамотно написаны

Gozar 12.02.2010 10:05

Цитата:

Сообщение от Arkaim (Сообщение 44531)
Подскажите в чем может быть проблема? Возможно есть более элегантный вариант решения?

точно есть, все переписывать лень, привожу начало рефакторинга:
var a;
a= [
{ razdel:"Главная [Мой сайт]",url:"/start",span:"<span>Главная</span>" },
{ razdel:"Блог [Мой сайт]",url:"/blog",span:"<span>Блог</span>" },
{ razdel:"Проект [Мой сайт]",url:"/projects",span:"<span>Проект</span>" }
];
alert(a[1].url);
//далее все выбросить что было написано и пойти читать про работу с DOM

http://javascript.ru/tutorial/dom/modify

http://javascript.ru/tutorial/dom

Arkaim 12.02.2010 13:31

sergdev, по идее браузеры должны соответствовать стандартам, то что существуют проблемы движка Ослика и мелкие у других, это я знаю. Дело в том что на событие hover тоже висит подсветка активного пункта меню и она работает во всех браузерах. Отсюда делаю вывод что проблемы со скриптом.
Gozar, спасибо буду читать и пробывать.

sergdev 12.02.2010 13:33

Цитата:

Сообщение от Arkaim (Сообщение 44569)
sergdev, по идее браузеры должны соответствовать стандартам, то что существуют проблемы движка Ослика и мелкие у других, это я знаю. Дело в том что на событие hover тоже висит подсветка активного пункта меню и она работает во всех браузерах. Отсюда делаю вывод что проблемы со скриптом.
Gozar, спасибо буду читать и пробывать.

Попробуйте взять хтмл просто написать и проверить во всех браузерах и так узнаете где проблема.

Arkaim 12.02.2010 16:08

sergdev, благодарю! Тоже идея, вечером буду пробовать...

Gozar 12.02.2010 17:35

Цитата:

Сообщение от Arkaim (Сообщение 44590)
sergdev, благодарю! Тоже идея, вечером буду пробовать...

чего тут пробовать, нужно как я сказал выбросить то что ниже определения объекта для меню и менять класс так:
element.style.className = 'active';

не надо там никаких document.write(), нужно прочитать как работают с DOM.

sergdev 12.02.2010 17:38

Цитата:

Сообщение от Gozar (Сообщение 44597)
чего тут пробовать

Я согласен с твоим сообщением, НО речь идет уже о принципе. Человек начал изучать джаваскрипт, в первом моем сообщение здесь я хотел ему посоветовать вообще не привязываться к document.title, ведь все это можно сделать как минимум на server-side языке. Это если говорить о правильном подходе, но думаю, что человек загнется если для того, чтобы показать какое то несчастное меню, нужно будет еще и пхп юзать и тд. Без обид, но подозреваю, что человек мало имеет представления вообще о программировании. Пусть учится отлавливать проблемы, etc. Я так понимаю, что это ж в образовательных целях. Вряд ли он бы взял коммерческое задание, будучи еще не профессионалом.


Часовой пояс GMT +3, время: 02:50.