基于复选框的值显示div

问题描述：

我有一个div格式（#sides），我只希望显示一个复选框（.opp-choice-checkbox）没有被选中。下面的代码我现在所拥有的：基于复选框的值显示div

jQuery -> 
    if !$(".opp-choice-checkbox").checked 
    $("#sides").hide() 
    $(".opp-choice-checkbox").click -> 
    $("#sides").slideToggle()

类似的问题被问了很多，但我的问题不同的是，当我去编辑对象的形式是，有时复选框默认选中。在这种情况下，我希望div在页面加载时显示。我现在的代码默认隐藏div，无论是否选中复选框

答

修订

您的代码与下面提及的小更新完美的工作，你的代码中看到Working fiddle：

的CoffeeScript：

你刚才添加的else在你的病情来显示DIV如果checkbox是检查：

jQuery -> 
    if !$(".opp-choice-checkbox").is(":checked") 
    $("#sides").hide() 
    else 
    $("#sides").show() 

    $(".opp-choice-checkbox").click -> 
    $("#sides").slideToggle()

如果有时你有个默认chekcked checkbox，你刚才删除的条件，并用T取代你coofee代码他以下几点：

jQuery -> 
    $(".opp-choice-checkbox").change -> 
    $("#sides").slideToggle()

见小提琴HERE。

我希望这会有所帮助。

这是真的，看到我的更新'$（“。opp-choice-checkbox”）。is（“：checked”）'，谢谢。 –

答

$(".opp-choice-checkbox")没有checked属性 - 这是一个jQuery元素。为了拿到常规DOM ELEM，使用[0]

$(".opp-choice-checkbox")[0].checked

或者，使用.is("checked")

$(".opp-choice-checkbox").is("checked")

如果这是所有连接到change或click事件，只是负载运行的事件来触发行为，（$(elem).change(function() { }).change()）

基于复选框的值显示div

相关推荐