Jquery выберите div в ряд

StackOverflow https://stackoverflow.com/questions/1402132

Вопрос

Я действительно застрял .. Мне нужен срочный совет: D вот мой HTML: 

<!-- Beginning of ROW !-->
<div id="row1">
 <div id="entry">
  free
  <span>some text</span>
  <p>DKK</p>
  <input type="radio" name="red<% Response.Write(counter); %>" id="radio" value="0" />
 </div>

 <div id="entry">
  week
  <span></span>
  <p>DKK</p>
  <input type="radio" name="red<% Response.Write(counter); %>" id="radio2" value="75" />
 </div>
</div>
<!-- End of ROW !-->

<!-- Beginning of ROW !-->
<div id="row2">
 .... same as in row 1
</div>
<!-- End of ROW !-->

nth row ..

Вот Jquery: 

$("input").click(function() {
     $("input").parent("div").css("background", "url(images/div_bg.png)");
     $(this).parent("div").css("background", "url(images/div_bg_hover.png)");
});

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

alt text

И вот чего я добиваюсь:

alt text

Это было полезно?

Решение

Какова цель вашей второй строки jquery? 

$("input").parent("div").css("background", "url(images/div_bg.png)");

Это приведет к сбросу фона всех элементов " entry " дивы. Если я правильно понимаю вашу цель, я думаю, что вы хотите: 

$(this).parent("div").siblings("div.entry").css("background", "url(images/div_bg.png)");

Таким образом, только родные братья изменяемой записи получат сброс своего фона.

Кстати, у вас есть несколько div с одним и тем же идентификатором, что не очень хорошая идея.

Другие советы

Эта строка: $ (" input "). parent (" div "). css (" background " ;, " url (images / div_bg.png) " вызывает все остальные элементы сбрасываются в нормальное состояние, что позволяет вам иметь только 1 активное состояние за раз. Вы можете ограничить его до строки, чтобы в каждой строке был выбран один элемент.

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

function foo()
{
   $('input :selected').css(bar);
}

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

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top