Question

我发生了一些奇怪的行为，我无法解决。我已经编写了一些代码来为包含标签和复选框的列表添加一些功能。如果用户启用了javascript，我希望隐藏复选框，并使标签变为可点击并更改其外观以指示它们是否已被选中。这是代码：

$(".cal_checkbox").each(function(){
$(this).hide();
var id = $(this).attr('id');
if($(this).attr('checked'))
    {
    $('#cal_checkbox_'+id).css({"font-weight":"bold"}).css({'color':'#7C001D'}) // make bold and red if selected
    .click(function(){
        $(this).attr('checked', false)
    })
    }
else
    {
    $('#cal_checkbox_'+id).click(function(){
        $(this).attr('checked', true)
    })
    }});

如果我注释掉hide（）行，这样可以正常工作，即如果复选框可见，你仍然可以点击标签，一切都会改变并起作用。但是，如果我将hide（）保留在其中并且复选框变为不可见，则整个操作将停止工作。我认为hide（）只是以与“display：none;”相同的方式呈现所选元素。它是否完全删除了元素？

Answer 1

在您的点击功能中，“this”的上下文将被分配给“'#cal_checkbox _'+ id”元素（我假设它是复选框旁边标签的ID？

hide（）只是将display css propery更新为none。它不会从DOM中删除元素。

如果您使用HTML元素作为复选框标签，那么这可能会解释为什么在隐藏复选框时会出现问题。

你可以发布你的HTML以及javascript吗？

JQuery hide（）和复选框选择

1 个答案: