Помогите разобраться jQuery

[AKyHuH]

Здравствуйте!

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

есть:

item = document.getElementById(id);

нужно к родителю item добавить класс "simle_class"...

html вот такой:

<ul>
<li class="menu" id="menu_item1">
<a href="">Link</a>
<div id="id1" class="dropdownmenu" style="visibility: hidden">
...
</div>
</li>
...
<li>...</li>
</ul>

в общем-то ситуация следующая. Есть меню с выпадающими подменю для каждого пункта, при наведении курсора на ссылку меню она меняет размер (li a:hover {font-size: 120%;} и появляется выпадающее подменю, так вот проблема в том, что когда курсор перевожу на выпадающее подменю, естественно стиль a:hover для ссылки меню пропадает... а нужно, чтобы шрифт пункта меню оставался укрупненным, пока курсор на его выпадающем подменю.

подумал, что правильно будет добавить к пункту меню новый класс (например "simle_class") когда открыто подменю и удалить этот класс, когда подменю закрывается... а в этом классе уже задать все украшательства для раскрытого пункта меню. НО ума не приложу, как добавить этот класс к элементу <li>, если знаю только id div'a, находящегося внутри него.

Edited February 2, 2010 by AKyHuH

[alexspb]

копайте в сторону

item.className="simle_class"

если я вас правильно понял и выхотите через жаву сделать

[AKyHuH]

проблема в том, что мне не к item надо класс добавить, а к его родителю... в данном случае это должен быть класс к элементу списка <li>

Вообще я как-то примерно так себе это представляю, но оно не работает:

id известно

function( id ){
				item = document.getElementById(id);
				parentId = item.parent().attr('id');
				jQuery(parentId).addClass('simple_class');
}

сдается мне, вот тут что-то не так: parentId = item.parent().attr('id');

Edited February 2, 2010 by AKyHuH

[AKyHuH]

Ну же, господа, одним местом чую, что эта задача не сложнее "hello world!", подскажите как решить, а то вся работа встала из-за этого

[amiron]

Если отвечать конкретно на вопрос

"нужно к родителю item добавить класс "simle_class"..."

то попробуй

$("#" + id ).parent().addClass("simle_class");

[Great Rash]

Методы jQuery работают только с объектами jQuery.

Вы же получаете объект вот так:

item = document.getElementById(id);

здесь item будет не объектом jQuery, а просто нодой

Вполне естественно, что у вас нифига не работает...

Я всегда говорил и буду говорить, что фреймворки - абсолютное зло!.

Вот решение на чистом JS (заметьте, не на много больше кода):

var item = document.getElementById(id);
item.parentNode.className += ' simle_class';

[AKyHuH]

Огромное спасибо, вот только по факту кода возник следующий насущный вопрос, а как потом этот класс отключить, ну когда у меня закроется подменю мне надо будет его отключить, в jQuery можно сделать просто removeClass, в тут как?

[Great Rash]

Да пожалуйста:

var item = document.getElementById(id);
item.className += ' simle_class';
alert(item.className);

var regExp = /simle_class|\ssimle_class/g;
item.className = item.className.replace(regExp, '');
alert(item.className);

Если нравится юзать все это как в jQuery, то можно оформить в функции и колбасить вот так:

Object.prototype.addClass = function(class) {
	if (class) {
		if (!this.className) {
			this.className = class;
		} else {
			this.className += ' ' + class;
		}
	} else {
		return;
	}
}

Object.prototype.removeClass = function(class) {
	if (class) {
		var regExp = eval('/' + class + '|\s' + class + '/g');
		this.className = this.className.replace(regExp, '');
	} else {
		return;
	}
}

// а дальше юзаем как во фреймворке
var obj = document.getElementById('test');

obj.addClass('test');
alert(obj.className);

obj.removeClass('test');
alert(obj.className);

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

[AKyHuH]

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

[Great Rash]

Это конечно да, но ИМХО, чтобы начать использовать фреймворк надо сначала знать как язык работает. А то получатся проблемы как у вас, на пустом месте.

[AKyHuH]

полностью согласен, поэтому в самом начале и оговорился, что я понятия не имею о синтаксисах JS и jQuery... в данный момент я вообще занимаюсь версткой шаблона и столкнулся с недоделкой программеров, выпадающее меню смотрелось некрасиво из-за невозможности связать классы подменю и основного меню на событиях onmouseover и onmouseout. Теперь, с вашей помощью всё заработало, спасибо огромное