2009-09-09 11 views
0
semaine

DKKFond de bascule Jquery?

"id =" radio2" value = "75" />

Je tas de ces entrée div générée par while donc je veux y parvenir: lorsque l'entrée à l'intérieur de l'entrée est cliqué Je veux que l'image d'arrière-plan de l'entrée div change, mais si je choisis une autre radio dans une autre entrée div .. Je voudrais que tous les changements précédents (tels que le changement d'arrière-plan) disparaissent et changent l'arrière-plan du div .. est ce que j'ai essayé de faire peut-être vous pouvez aider .. voici jquery ci-dessous

$("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)"); 

      }); 

Quelque chose ne fonctionne pas .. Je veux dire que le code fonctionne 'du tout .. quelqu'un peut-il m'aider? merci


J'ai essayé à la fois ceci:

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

ET

$("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)"); 
        } 
       }); 
      }); 

pour une raison quelconque sa ne fonctionne pas du tout de ne pas changer l'arrière-plan, peut-être qu'il doit faire quelque chose avec le code ci-dessus est le script complet:

<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> 

Répondre

3

Le premier problème immédiat que je vois est que votre jQuery manque un }); à la fin de celui-ci à moins que vous ayez juste oublié de le coller là. Cela l'empêcherait de faire autre chose que de lancer une erreur ...

Ceci est une version simplifiée que vous avez déjà essayée. Cela pourrait au moins faciliter le débogage.

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

Bien que, je ne vois rien de mal à ce que de toute évidence vous avez essayé avant qui me demande si $("input") est assortissent ce que vous pensez qu'il est. Je serais probablement au moins alerter certaines choses à l'intérieur de votre fonction de clic pour la vérification de la santé mentale. Je l'ai trouvé en fait quelques fois que mon $(document).ready congédiait avant que je pensais que ce soit avant mes entrées étaient prêts à cause de mon cadre ...

+0

Il n'y a pas de '});' et l'arrière-plan est un raccourci parfaitement valide –

+0

Le premier jeu de javascript est manquant}); probablement pas le problème. Juste pas collé. Eduardo a raison sur le fond, c'est un raccourci css valide donc je l'ai édité ... –

+0

cela fonctionne merci, et merci à tous pour vos réponses! – ant

0

vous devrez peut-être utiliser 'background-image' au lieu de simplement 'background' pour définir les images. J'ai eu des problèmes avec la propriété css 'background' dans jQuery auparavant, mais après l'avoir testé sur différents navigateurs, il semble que je me soit trompé ou qu'il ait été corrigé dans les versions de jQuery depuis que j'ai travaillé dessus.

+0

Ce n'est pas le problème. L'arrière-plan est un raccourci parfaitement valide –

1

Il y a plusieurs problèmes:

  • Vous utilisez Toggle et la fonction bascule est:

Si elles sont représentées, bascule les rend caché (en utilisant la méthode de peau). Si ils sont cachés, toggle les fait afficher (en utilisant la méthode show).

Vous devriez demander si la radio est cochée

  • Vous devez appeler la fonction each, afin de changer l'autre radio div valeurs

  • Vous devez appeler la fonction $(document).ready()

Exemple (Attention: Javascript n'est pas ma meilleure arme):

<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> 

Note: Je l'ai utilisé backgound couleurs pour mieux les tests, mais votre utilisation de fond est bonne.