Обработка множества элементов одним скриптом
Здравствуйте,
помогите понять как jquery работает с множеством элементов? Как он определяет идентификатор обрабатываемого элемента. Вот пример: есть <div id="pic"><img src=" images/1.gif"><div id="masseg" style="display:none;">Описание русунка 1</div></div> <div id="pic"><img src=" images/2.gif"><div id="masseg" style="display:none;">Описание русунка 2</div></div> <div id="pic"><img src=" images/3.gif"><div id="masseg" style="display:none;">Описание русунка 3</div></div> Ну вот использую такой jquery
$(document).ready(function() {
$('#pic').hover(function(){ // добираемся до элемента по которому будем кликать
$(this).find('#masseg').animate({'opacity': '1'},500).css({'display':'block'}); // а теперь аккуратно выводим наш блок
},
function(){ // убираем блок
$(this).find('#masseg').animate({'opacity':'0'},500).css({'display':'none'});
});
});
Пример работает только c первым блоком(images/1.gif) работает замечательно, но когда навожу мыш на другие блоки, результата никого((( Объясните, как обрабатывать большое количество блоков одним jquery скриптом? |
Цитата:
$('#pic')
nalezhitiy, ИД у элементов должен бытьуникальным в пределах страницы. Утебя же он повторён 3 раза. |
Тогда нужно записать типа вот так:
<div id="pic1"><img src=" images/1.gif"><div id="masseg" style="display:none;">Описание русунка 1</div></div> <div id="pic2"><img src=" images/2.gif"><div id="masseg" style="display:none;">Описание русунка 2</div></div> <div id="pic3"><img src=" images/3.gif"><div id="masseg" style="display:none;">Описание русунка 3</div></div> А в jquery указать список этих
id($('#pic1','#pic2'...))
?Или просто пересоздать структуру моего кода, или как получить масив всех id и с ними работать? |
Цитата:
Так же у тебя есть дубляж еще одного идентификатора - masseg. Это неприемлемо по тем же причинам... |
Вот нашёл решение для сбора массива id
var ids = [] ;
$('#gallery')
.find('div[id*="pic"]') //сбор всех id слоя где есть "pic"
.each(function() {
ids.push(this.id); // заганяем значение id в переменую ids
}) ;
<div id="gallery"> <div id="pic1"><img src=" images/1.gif"><div id="masseg1" style="display:none;">Описание рисунка 1</div></div> <div id="pic2"><img src=" images/2.gif"><div id="masseg2" style="display:none;">Описание рисунка 2</div></div> <div id="pic3"><img src=" images/3.gif"><div id="masseg3" style="display:none;">Описание рисунка 3</div></div> </div> Теперь думаю как использовать эти данные. если кто поможет спасибо |
$(ids).each(function () {
$('#' + this).чтототам();
});
$('#' + this) т е это обращение к элементу |
Matre,
большое спасибо |
Насколько я знаю множественное использование id не правильный подход к написанию любой страницы так как id обязан быть уникальным.
используйте class и будет вам счастье:) |
розовый слоник
у тс id разные pic1,pic2,pic3 см #5 |
| Часовой пояс GMT +3, время: 13:42. |