Question

如果您到这里http://passion4web.co.uk/DigiPics/upload并上传照片，您会看到它会显示一些复选框选项以提亮，扭曲。我正在使用jquery来克隆#photo-template所以我可以多次使用它，但我遇到的问题是单击时复选框不会改变。

当我使用javascript向网页添加基础复选框时，似乎只会发生这种情况。这是我添加它们的方法：

    var $template = $("#photo-template");
    var $addedPhotos = $("#added-photos"); 
    $addedPhotos.html("");

    if(response.length > 0)
    {
        for(var i in response)
        {
            var options = response[i];
            var template = $template.clone();

            template.find(".photo").attr("src", options['Photo URL']);
            template.find(".brighten").prop("checked", options['Brighten']);
            template.find(".sky").prop("checked", options['Sky']);
            template.find(".grass").prop("checked", options['Grass']);
            template.find(".distortion").prop("checked", options['Distortion']);
            template.find(".description").val(options['Description']);

            $addedPhotos.append(template.html());
        }
    }

Answer 1

您未正确使用for的{{1}}属性。 HTML的摘录是：

label

<div class="switch round"> <input type="checkbox" class="sky" name="sky"> <label for="sky"></label> </div>的值需要与复选框的for匹配。它应该是：

id

不幸的是，既然你正在克隆它，你还需要使这些<div class="switch round"> <input type="checkbox" class="sky" name="sky" id="sky"> <label for="sky"></label> </div>独一无二。一种可能的解决方案：

id

基础复选框停止使用jQuery

1 个答案: