Question

我正在尝试检查/取消选中动态生成的复选框。但我无法这样做。我想要做的是 - 比如，我有5个复选框，点击第5个复选框，前4个也应该被检查。以下是代码：

function checkImages(id) {
    if ($('#' + id).is(":checked")) {
        for (i = parseInt(id) ; i >= 0; i--) {          
            $("#" + id).attr("checked", true);
        }
    } else {
        $(".selectedImages").prop("checked", false);
    }
}

HTML：

@for (int i = 0; i < Model.ImageList.Count; i++)
{
    <div id="id @i" style=" margin:10px; float:left; height:100px; overflow:hidden; width:100px;">
        <input type="checkbox" id=@i name="selectedImages" value="Weekly" onclick="checkImages(id);">
    </div>
}

在这里你看到id =“2”被检查但是id =“1”没有任何被检查的属性

Answer 1

您的代码存在许多问题，主要问题是：

$("#" + id).attr("checked", true);

应该是

$("#" + i).prop("checked", true);

和清晰的代码：

$(".selectedImages").prop("checked", false);

按类选择，但您的元素有name=selectedImages，所以应该是：

<input type="checkbox" id="@i" class="selectedImages" ...

最后，你的循环变为0，但第一个元素是1（一个小问题）。

假设您的onclick=代码传递了正确的值，此处更新了代码

示例HTML

<input type="checkbox" id="1" class="selectedImages" value="Weekly" onclick="checkImages('1');">
<input type="checkbox" id="2" class="selectedImages" value="Weekly" onclick="checkImages('2');">
<input type="checkbox" id="3" class="selectedImages" value="Weekly" onclick="checkImages('3');">

jquery的：

function checkImages(id) {
    if ($('#' + id).is(":checked")) {
        for (i = parseInt(id) ; i >= 1; i--) {          
            $("#" + i).prop("checked", true);
        }
    } else {
        $(".selectedImages").prop("checked", false);
    }   
}

示例代码：http://codepen.io/anon/pen/BKoGaq

然而，如果不提及您不应该使用这样的数字ID，那将是我的疏忽 - 而是使用data-属性，例如：

HTML：

<input type="checkbox" data-id="1" class="selectedImages" value="Weekly" onclick="checkImages(this);">
<input type="checkbox" data-id="2" class="selectedImages" value="Weekly" onclick="checkImages(this);">
<input type="checkbox" data-id="3" class="selectedImages" value="Weekly" onclick="checkImages(this);">

jquery的

function checkImages(el) {
   id = $(el).data("id");
   console.log(id)
   if ($(el).is(":checked")) {
        for (i = parseInt(id) ; i >= 1; i--) {          
            $(".selectedImages[data-id='" + i + "']").prop("checked", true);
        }
    } else {
        $(".selectedImages").prop("checked", false);
    }   
}

你也可以使用jquery事件处理程序而不是＆＃34; onclick＆＃34;。

动态生成的复选框无法检查

1 个答案: