Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.01.2011, 19:15
Новичок на форуме
Отправить личное сообщение для nalezhitiy Посмотреть профиль Найти все сообщения от nalezhitiy
 
Регистрация: 23.11.2010
Сообщений: 8

Обработка множества элементов одним скриптом
Здравствуйте,
помогите понять как 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 скриптом?

Последний раз редактировалось nalezhitiy, 17.01.2011 в 19:32.
Ответить с цитированием
  #2 (permalink)  
Старый 17.01.2011, 21:59
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от nalezhitiy
Пример работает только c первым блоком
Потому как там явно указан ИД элемента

$('#pic')


nalezhitiy, ИД у элементов должен бытьуникальным в пределах страницы. Утебя же он повторён 3 раза.
Ответить с цитированием
  #3 (permalink)  
Старый 18.01.2011, 12:11
Новичок на форуме
Отправить личное сообщение для nalezhitiy Посмотреть профиль Найти все сообщения от nalezhitiy
 
Регистрация: 23.11.2010
Сообщений: 8

Тогда нужно записать типа вот так:
<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 и с ними работать?
Ответить с цитированием
  #4 (permalink)  
Старый 18.01.2011, 16:35
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,215

Сообщение от nalezhitiy
А в jquery ...
Я с jquery не работаю...

Так же у тебя есть дубляж еще одного идентификатора - masseg. Это неприемлемо по тем же причинам...
Ответить с цитированием
  #5 (permalink)  
Старый 18.01.2011, 16:43
Новичок на форуме
Отправить личное сообщение для nalezhitiy Посмотреть профиль Найти все сообщения от nalezhitiy
 
Регистрация: 23.11.2010
Сообщений: 8

Вот нашёл решение для сбора массива 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>

Теперь думаю как использовать эти данные.
если кто поможет спасибо
Ответить с цитированием
  #6 (permalink)  
Старый 18.01.2011, 17:14
Профессор
Отправить личное сообщение для Matre Посмотреть профиль Найти все сообщения от Matre
 
Регистрация: 07.01.2011
Сообщений: 582

$(ids).each(function () {
$('#' + this).чтототам();
});


$('#' + this) т е это обращение к элементу
Ответить с цитированием
  #7 (permalink)  
Старый 18.01.2011, 17:33
Новичок на форуме
Отправить личное сообщение для nalezhitiy Посмотреть профиль Найти все сообщения от nalezhitiy
 
Регистрация: 23.11.2010
Сообщений: 8

Matre,
большое спасибо
Ответить с цитированием
  #8 (permalink)  
Старый 19.01.2011, 19:42
Профессор
Отправить личное сообщение для розовый слоник Посмотреть профиль Найти все сообщения от розовый слоник
 
Регистрация: 17.10.2009
Сообщений: 258

Насколько я знаю множественное использование id не правильный подход к написанию любой страницы так как id обязан быть уникальным.
используйте class и будет вам счастье
Ответить с цитированием
  #9 (permalink)  
Старый 19.01.2011, 20:10
Профессор
Отправить личное сообщение для Matre Посмотреть профиль Найти все сообщения от Matre
 
Регистрация: 07.01.2011
Сообщений: 582

розовый слоник

у тс id разные
pic1,pic2,pic3
см #5
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Обработка элементов в dijit.Dialog Белый Тигр Dojo toolkit 5 13.10.2011 18:31
Изменение множества элементов Input по определённом призна Лавсановые Волокна Элементы интерфейса 1 24.12.2010 10:37