jQuery自定義複選框 - 圖形更新不起作用

嘗試在窗體加載時設置自定義複選框值。調試告訴我，該複選框反映了從源加載的值，但自定義圖形不會更新。jQuery自定義複選框 - 圖形更新不起作用

在我的表單中我有

<input class="checkbox" type="checkbox" name="uitem_autorenew" id="uitem_autorenew" />

風格，我有：

.checkbox { 
     display: none; 
    } 

    .toggle { 
     background: url("toggle.png") bottom left; 
     display: block; 
     width: 70px; 
     height: 22px; 
    } 

    .toggle.checked { 
     background-position: top left; 
    }

代碼包括以下

 $(document).ready(function() { 

     $('.checkbox').after(function() { 
      if ($(this).is(":checked")) { 
       return "<a href='#' class='toggle checked' ref='" + $(this).attr("id") + "'></a>"; 
      } else { 
       return "<a href='#' class='toggle' ref='" + $(this).attr("id") + "'></a>"; 
      } 

     });

...成有一個開放的事件對話框。 ..根據數據明確設定勾選或取消勾選功能

   var ar=$(this).data('renew'); 
       console.log("Value of ar = " + ar); // which is Y 

       if (ar =="Y"){ 
        $("#uitem_autorenew").prop('checked',true); // tried this 
        $("#uitem_autorenew").toggleClass("checked"); //tried this too 


       } 

       console.log ("Is checkbox checked?"); 
       console.log ($("#uitem_autorenew").prop('checked')); // yes it is but the graphic has not toggled. Top left of toggle.png is has word "YES"

我只是想知道我在樣式沒有改變的情況下丟失了什麼。任何線索都歡迎並提前致謝。 Kevin

來源

2013-08-18 KevinY

您可以在複選框元素上切換「checked」類，但是您想要爲動態創建的a-tag更改它。所以嘗試改變

$("#uitem_autorenew").toggleClass("checked");

到

$(".toggle").toggleClass("checked");

來源

2013-08-18 21:31:57

jQuery自定義複選框 - 圖形更新不起作用

回答

相關問題