Jquery Code zum Anzeigen von Link, während Kontrollkästchen beim ersten Laden der Seite aktiviert ist

Question

Ich habe einen folgenden Code, der funktioniert, wenn ich das Kontrollkästchen ein- oder auschecke, aber wenn ich meine Seite anfange und einige meiner Checkboxen bereits aktiviert sind , möchte ich die div-Box zeigen, sichtbar zu sein, aber der Code ist nicht zu tun, bin ich etwas

bitte führen Sie durch den folgenden Code

Dank

$(document).ready(function() { 
    //check the state of the checkox 
    $(".showinvoice").is(':checked') { 
     var stats = $(this).attr('data-id'); 
     $("#"+stats).css('display','block'); 
    } 
    //check the code only when the click button is triggered  
    $(".showinvoice").click(function(e) { 
     var getStudent = $(this).attr('data-id'); 
     if ($(this).is(':checked')) { 
      $("#"+getStudent).css('display','block'); 
     } else { 
      $("#"+getStudent).css('display','none'); 
     } 
    }); 
}); 

Answer 1

zum einen fehlt Ihnen fehlt die if Aussage a um den .showinvoice Zustand Zustand.

Zweitens sollten Sie die data() Methode verwenden, um auf data-* Attribute zuzugreifen. Sie sollten auch die Methode change verwenden, wenn Sie Radio- und Kontrollkästcheneingaben verwenden, damit die Ereignisse von Benutzern, die mit der Tastatur navigieren, noch immer ausgelöst werden. Zuletzt können Sie die if Anweisung entfernen und stattdessen toggle() verwenden.

Um zu erreichen, was Sie benötigen, alles, was Sie tun müssen, ist ein Ereignis auf die Kontrollkästchen auf der Seite laden. Versuche dies;

// check the state of the checkox 
if ($(".showinvoice").is(':checked')) { 
    var stats = $(this).data('id'); 
    $("#" + stats).show(); 
} 

// check the code only when the click button is triggered  
$(".showinvoice").change(function(e) { 
    var getStudent = $(this).data('id'); 
    $("#" + getStudent).toggle(this.checked); 
}).change(); // < to run this code when the page loads 

Answer 2

Versuchen Sie, Ihren ersten Teil Wechsel zu ...

//check the state of the checkox 
$(".showinvoice:checked").each(function() { 
    var stats = $(this).data('id'); 
    $("#"+stats).css('display','block'); 
});