试图让容器 div 在点击时改变高度答案

【问题标题】：Trying to make container div change height on click试图让容器 div 在点击时改变高度
【发布时间】：2017-05-04 05:10:04
【问题描述】：

我正在尝试使容器 div 在单击时更改设置高度，但无法使其正常工作。我不确定我在哪里搞砸了，并且会喜欢输入，因为我对 Javascript 还是很陌生。

$(function() {
  $('#menu').click(function() {

        $(".outer").css('height','600px ');
 });
 });

【问题讨论】：

抱歉，感谢您发现这些错误，但它仍然不起作用。
在您的环境中，还是在 JSFiddle 中？您的小提琴没有附加 jQuery，因此无论语法如何，它都不起作用。如果你想让你的小提琴工作，请单击 JAVASCRIPT > Frameworks & Libraries > jQuery 3.1.1。 Here is a fixed JSfiddle.
在JSFiddle中你需要指定jquery框架。

【解决方案1】：

如果您只是想增加点击时的高度，那么您不需要在 JS 中执行此操作。你也可以用html来做。

<div id="outer">
  <div id="menu" onClick = "document.getElementById('outer').style.height = '600px';">
  
   </div>
  </div>

【讨论】：

【解决方案2】：

Oki 几个错误：

修改后的代码：

$(function() {
      $('#menu').click(function() {
        $(".outer").css('height', '600px');
      });
})

$(function() {
      $('#menu').click(function() {

        $(".outer").css('height', '600px');
      });
    })

.outer {
  width: 200px;
  height: 200px;
  background-color: #111111;
}

#menu {
  height: 20px;
  width: 20px;
  background-color: #666666;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="outer">
  <div id="menu">
  </div>
</div>

【讨论】：

修复简单的语法错误应该保留为 cmets 以及投票关闭，而不是作为答案。 “有关无法再重现的问题或由简单的印刷错误引起的问题 [不在 StackOverflow 的主题范围内]。” - Source
@Santi heh 这并不意味着答案是错误的。如果您投反对票，则表明您的答案不能解决问题；）
@Santi 还建议在 cmets 中为您的投反对票提供推理。
@Santi 你给了一个问题的链接，而不是回答;)
@StefanBob 6 人已经回答了这个问题。我发表了 4 次评论。其中3个被删除。我不会坐在这里对 10 个答案重新发布相同的评论，因为他们的发布者不了解规则。

【解决方案3】：

您的点击功能缺少右括号：

$('#menu').on('click', function() {
    $('.outer').css('height', '400px');
});

.outer {
  width: 200px;
  height: 200px;
  background-color: #111111;
}

#menu {
  height: 20px;
  width: 20px;
  background-color: #666666;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="outer">
  <div id="menu">
  
   </div>
  </div>

【讨论】：