JQuery Select Div em uma fila

Question

Estou realmente preso .. eu preciso de conselhos urgentes: D Aqui está o meu 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 ..

Aqui está o 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)");
});

O que estou tentando fazer. Então eu seleciono o valor na segunda linha. A div na segunda linha, onde a entrada de rádio está localizada muda de fundo como deveria, mas a div na primeira linha se reverte para outro fundo, embora a entrada permaneça verificada. Aqui está o que estou tentando alcançar

E aqui está o que eu alcanço:

Answer 1

Qual é o objetivo da sua segunda linha de jQuery?

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

Isso vai redefinir o plano de fundo de todos os divs de "entrada". Se eu entendi seu objetivo corretamente, acho que você quer:

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

Dessa forma, apenas os irmãos da entrada que você está alterando obterão seus antecedentes redefinir.

Em uma nota lateral, você tem várias divs com o mesmo ID, o que não é uma boa ideia.

Answer 2

Está linha: $("input").parent("div").css("background", "url(images/div_bg.png)" está fazendo com que todos os outros itens sejam redefinidos para o normal, permitindo que você tenha apenas 1 estado ativo por vez. Você pode escovê -lo para a linha para que cada linha tenha um item selecionado.

Answer 3

Você está atribuindo apenas comportamento ao item clicado, em vez de todas as caixas de entrada selecionadas. Você pode querer fazer uma função como tal:

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

Agora, sempre que você obtém um evento de clique em um evento de entrada, ligue para a barra. Pode ser necessário modificar o Foo para atender às suas especificações.