Question

我有一个表单（#sides）中的div，我只想在未选中一个复选框（.opp-choice-checkbox）时显示。这是我现在的代码：

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

类似的问题被问了很多，但与我的问题的不同之处在于，当我去编辑表单所针对的对象时，默认情况下有时会选中复选框。在那种情况下，我希望在页面加载时显示div。我现在拥有的代码默认隐藏div，无论是否选中了复选框

Answer 1

$(".opp-choice-checkbox")没有checked属性 - 这是一个jQuery元素。要获取常规DOM元素，请使用[0]

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

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

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

如果全部附加到change或click事件，则只需在加载时运行该事件即可触发行为，（$(elem).change(function() { }).change()）

Answer 2

<强>已更新

您的代码与下面提到的小更新完美配合，请参阅 Working fiddle 代码：

CoffeeScript：

您只需在条件中添加else即可在检查checkbox时显示div：

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

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

如果您有时默认情况下有checkbox，那么您只需删除条件并通过以下内容替换您的coofee代码：

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

请参阅小提琴 HERE 。

我希望这会有所帮助。

根据复选框的值显示div

2 个答案: