Jquery切换背景？

Question

week

DKK

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

我有一堆由 while 循环生成的 div 条目，所以我想实现这一目标：当单击条目内的输入时，我希望更改条目 div 的背景图像，但如果我在另一个条目 div 中选择另一个收音机..我会就像之前所有的更改（例如之前背景的更改）一样，要消失并更改当前 div 的背景.. 这是我尝试做的，也许你可以提供帮助.. 下面是 jquery

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

             });

出现故障.. 我的意思是代码安装'在工作..有人能帮助我吗？谢谢，

---

我已经尝试过这两种方法：

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

并且

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

由于某种原因它根本不起作用而不改变背景，也许它必须对上面的代码做一些事情，这是完整的脚本：

 <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

我看到的第一个直接问题是您的 jQuery 末尾缺少 }); ，除非您忘记将其粘贴到那里。这将阻止它执行除抛出错误之外的任何操作...

这是您之前尝试过的简化版本。它至少可以使调试稍微容易一些。

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

尽管如此，我没有发现您之前尝试过的任何明显错误，这让我想知道 $("input") 是否与您的想法相匹配。我可能至少会提醒您的点击函数中的一些内容以进行健全性检查。实际上，我发现有几次我的 $(document).ready 在我认为是在我的输入准备好之前就被触发了，因为我的框架......

Answer 2

有几个问题：

• 您正在使用 Toggle 并且 Toggle 函数是：

如果显示它们，则切换会使它们
隐藏（使用 hide 方法）。如果
它们是隐藏的，切换使它们
显示（使用 show 方法）。

您应该询问是否选中了无线电

• 您应该调用each函数，以便更改其他radio div值

• 您应该调用 $(document).ready() 函数

示例（警告: Javascript 不是我最好的武器):

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

注意：我使用了背景颜色来进行更好的测试，但是你对背景的使用很好。

Answer 3

您可能需要使用“background-image”而不仅仅是“background”来设置图像。

编辑：我以为我之前在 jQuery 中的“background”css 属性上遇到了麻烦，但是刚刚在各种浏览器上测试了它，看来我要么是错误的，要么自从我使用它以来它在 jQuery 版本中得到了修复。