Jquery alternar fondo?

Question

semana          

DKK

    " id = " radio2 " valor = " 75 " / >     

Tengo un montón de estas entradas div generadas por el bucle while, así que quiero lograr esto: CUANDO se hace clic en la entrada dentro de la entrada, quiero que cambie la imagen de fondo de la entrada div, pero si elijo otra radio en otra entrada div .. I Me gustaría que todos los cambios anteriores (como el cambio de fondo anterior) desaparecieran y cambiaran el fondo de la división actual ... esto es lo que intenté hacer, tal vez usted pueda ayudar ... aquí está jquery a continuación

$("input").click(function() {

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

             });

Algo no funciona bien ... quiero decir que el código está funcionando ... ¿alguien me puede ayudar? gracias

---

He intentado esto:

$("input").click(function() {
                 $("input").each(function() {
                     if (this.checked) {
                         $(this).parent("div").addClass("highlight");
                     }
                     else {
                         $(this).parent("div").removeClass("highlight");
                     }
                 });
             });

Y

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

por alguna razón no funciona en absoluto, no cambia el fondo, tal vez tenga que hacer algo con el código anterior, aquí está el script completo:

 <script type="text/javascript">

         $(document).ready(function() {

             $(".left_navigation a:last").toggleClass('bolder');


             $("input").each(function() {
                 var element_value = $(this).val();
                 $(this).prev("p").append(" " + element_value + ",-");
             });


             $("input").click(function() {
                 $("input").each(function() {
                     if (this.checked) {
                         $(this).parent("div").addClass("highlight");
                     }
                     else {
                         $(this).parent("div").removeClass("highlight");
                     }
                 });
             });




         });

</script>

Answer 1

El primer problema inmediato que veo es que a su jQuery le falta un }); al final, a menos que haya olvidado pegarlo allí. Eso evitaría que haga algo más que arrojar un error ...

Esta es una versión simplificada de la que has probado antes. Al menos podría hacer que la depuración sea un poco más fácil.

<script type="text/javascript">
$(document).ready(function(){
    $("input").click( function() { 
         $("input").parent("div").removeClass("highlight");
         $(this).parent("div").addClass("highlight");
      });
  });
</script>

Sin embargo, no veo nada obviamente malo en lo que intentaste antes, lo que me hace preguntarme si $ (" input ") coincide con lo que crees que es. Probablemente al menos alertaría algunas cosas dentro de su función de clic para verificar la cordura. De hecho, he encontrado algunas veces que mi $ (document) .ready se estaba disparando antes de pensar que era, es decir, antes de que mis entradas estuvieran listas debido a mi marco ...

Answer 2

Hay varios problemas:

• Está utilizando Toggle y la función Toggle es:

  

Si se muestran, alternar los hace   oculto (usando el método hide). Si   están ocultos, alternar los hace   mostrado (usando el método show).

Debe preguntar si la radio está marcada

• Debe llamar a cada función, para cambiar los otros valores de radio div

• Debería llamar a la función $ (document) .ready ()

Muestra ( Advertencia: Javascript no es mi mejor arma ):

<script>
$(document).ready(function(){
    $("input").click( function() { 
         $("input").each(function() { 
             if (this.checked) {
                $(this).parent("div").css("background-color", "green") }
             else {
                $(this).parent("div").css("background-color", "red")}
          });
      });
  });
</script>

Nota: He usado el color de fondo para mejores pruebas, pero su uso del fondo es bueno.

Answer 3

puede que necesite usar 'background-image' en lugar de solo 'background' para configurar las imágenes.

edit: pensé que había tenido problemas con la propiedad 'background' css en jQuery antes, pero después de haberlo probado en varios navegadores parece que estaba equivocado o se solucionó en las versiones de jQuery desde que trabajé con él.