jQuery代码在初始页面加载时选中复选框时显示链接

Question

我有以下一段代码可以正常工作，当我选中或取消选中复选框时，但是当我最初加载我的页面并且某些复选框已经被选中时，我想显示div框可见，但是代码不可见这样做，我有什么遗漏吗

请指导以下代码

谢谢

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

首先，您缺少有关.showinvoice状态条件的if语句。

其次，您应该使用data()方法访问data-*属性。 处理单选和复选框输入时，还应该使用change方法，以便使用键盘导航的用户仍会引发事件。 最后，您可以删除if语句，而只需使用toggle() 。

要实现所需的全部功能，请在页面加载时在复选框上引发一个change事件。 尝试这个;

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

尝试将您的第一部分更改为...

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