Добавить обработчик jQuery для нескольких элементов?

Мне нужно иметь цикл for внутри моего jQuery.

Пример:

  for(i=0;i<counter;i++)
   {
    $("div"+i+"").click(function(){//some code});
   }

Как я могу это сделать?

EDIT:

Этот код был отправлен OP в комментарии к одному из ответов:

$("#displayPanel div").click(function (){ alert($(this).attr("id")); } 

<div id="displayPanel" class="displayPanel"> 
  <div id="heading"> Display Panel </div> <br/> 
  <div id="save" class="saveClass"></div> <br/> 
  <div id="field1" class="my"> 
    <label id="labelstr1">Untitled1</label> 
    <input id="inputstr1" type="text"/> 
  </div> 
  <div id="field2" class="my"> 
    <label id="labelstr2">Untitled1</label> 
    <input id="inputstr2" type="text"/> 
  </div> 
</div>

Предупреждение показывает мне идентификатор для первых двух div, а не для field1 и field2.

Примечание:

field1 и field2 div создаются "на лету".

Ответы

Ответ 1

Вы можете поместить divs с общим классом

<div id="d1" class="your_css_class your_control_class">
<div id="d2" class="your_css_class your_control_class">
<div id="d3" class="your_css_class your_control_class">
<div id="d4" class="your_css_class your_control_class">
<div id="d5" class="your_css_class your_control_class">

$(".your_control_class").click(function(){
   var div_id=$(this).attr("id"); // gives you the ID of the clicked div
   if(div_id==="d1") functionForDiv1();
   else if(div_id==="d2") functionForDiv2();
   ...
});

EDIT:

Если у вас есть все внутри этого большого div, вы можете сделать:

$("#displayPanel > div").click(function(){
...

Ответ 2

Цикл кажется ненужным, так как селектор для div будет применяться ко всем div.

$("div").click(function(){
  //this will apply to any div you click on the page
  //for example:
  $(this).css('color','red'); //change the color of the div clicked to red
});

EDIT. Поскольку вы упоминаете в редактировании, что # field1 и # field2 создаются "на лету", вам нужно использовать .live(), чтобы связать событие click, как показано ниже:

$("#displayPanel div").live('click', function(){
  alert($(this).attr('id'));
});

Ответ 3

Вы можете, например, пропустить все div следующим образом:

$("div").each(function() {
    $(this).hide(); // this points to the current element
});

Ответ 4

Да, вы можете иметь цикл for в jQuery, но, глядя на ваш вопрос, вам может и не понадобиться. Когда вы используете

$('div').click(function(). { ... });

Вы можете связать функцию как обработчик события для всех div с одной командой. Вы также можете использовать context, имя класса или другие атрибуты для фильтрации разделов, к которым применяется обработчик событий.

Если вы хотите выполнить другое действие для каждого div, вам лучше всего иметь уникальный идентификатор для каждого div, а затем привязать обработчик событий, используя

$('#divId').click(function() { ... });

Ответ 5

Предполагая, что html

<div class="module">
  <div id="header1">h</div>
  <div id="content1">c</div>
</div>
<div class="module">
  <div id="header2">h</div>
  <div id="content2">c</div>
</div>
<div class="module">
  <div id="header3">h</div>
  <div id="content3">c</div>
</div>

Вы можете сделать цикл таким образом с помощью jquery: Например, когда вы нажимаете заголовок, содержимое скрывается.

$(".module").each(function(index){
   $("#header"+index).click(function(){
      $("content"+index).hide()
   });
});

Возможно, вам захочется взглянуть на jQuery.each(collection, callback (indexInArray, valueOfElement)) function http://api.jquery.com/jQuery.each/

Ответ 6

У этих div есть общий родитель, атрибут или что-то еще? Согласование по идентификаторам определенной формы (т.е. divXYZ в вашем случае), вероятно, не самая простая/самая очевидная вещь. Документация API для Selectors содержит полный список различных способов выбора элементов. Выберите тот, который наиболее подходит, и JQuery упрощается.

Здесь приведен пример выбора div с общим родительским:

$("#parent > div").click(function() {
    // some code
});

И для выбора div с общим атрибутом (если у них нет общего родителя, одно решение может давать каждому атрибуту cusotm):

$("div[fooAttribute]").click(function() {
    // some code
});