Question

我想在加载Ajax数据后自动调整div元素的大小。到目前为止，我没有任何问题，使它更高

success: function (data) {
              var oldSize = $("#DivPreview").height();
              $("#DivPreview").html(data.d);
              var newSize = $("#DivPreview").height();
              $("#DivPreview").height(oldSize).animate({ height: newSize });
}

但这只是第一次有效，之后oldSize和newSize无关紧要，它不会使div变小有人知道如何动态地动态更改Height属性吗？

如果这对您有用，我想为新主题创建某种预览/建议在此页面上，当您想要创建一个新问题"Questions that may already have your answer"框

感谢您的帮助

Answer 1

请改用scrollHeight。 Height()设置css值，因此不会第二次更新。由于在父级上设置了高度，因此您需要计算内容的大小。

function resizeDiv (elements) {
  // This will actually just get the css value (which was set last time)
  var oldSize = $("#DivPreview").height();
  $("#DivPreview").html(elements);
  // Since height is already set, we calculate the size of the contents instead.
  var newSize = $("#DivPreview ul")[0].scrollHeight;
  $("#DivPreview").height(oldSize).animate({ height: newSize });
}

$('#DivLong, #DivShort').click(function(){
  var $el = $(this).html();
  resizeDiv($el);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="DivPreview">
<ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ul>  
</div>

<div id="DivShort">
<ul>
  <li>One (click me)</li>
  <li>Two</li>
</ul>  
</div>

<div id="DivLong">
<ul>
  <li>One (click me)</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
  <li>Five</li>
  <li>Siz</li>
  <li>Seven</li>
  <li>Eight</li>
  <li>Nine</li>
</ul>  
</div>

请参阅以下答案以获取更多信息。

jQuery height() not changing on resize

Answer 2

我建议将$.data放在一个全局变量中，或者按照以下方式将其放在#DivPreview success: function (data) { var oldSize = $("#DivPreview").data("oldSize") != null ? $("#DivPreview").data("oldSize") : $("#DivPreview").height(); $("#DivPreview").data("oldSize", oldSize); $("#DivPreview").html(data.d); var newSize = $("#DivPreview").height(); $("#DivPreview").height(oldSize).animate({ height: newSize }); }中，以便它始终存在：

sshagent(['RemoteCredentials']) {
    sh 'ssh -o StrictHostKeyChecking=no -l remoteusername remotetarget uname -a'
  }

更改内容后JQuery动画元素高度

2 个答案: