当 div 的内容发生更改时，如何自动调整 div 的大小以适应其内容的大小？

目前，我有这个 DIV，其中有一个注册表单位于页面中央。 DIV 的内容来自 ascx 页面。这做得很好。 现在，如果用户尝试填写不唯一的名称，某些 jQuery 会在用户名字段旁边添加一条错误消息。这破坏了 DIV 的布局，因为现在的内容比以前更宽。 所以我用谷歌搜索了这个问题，但我找不到解决方案。

谁能帮我找到一个好方法来做到这一点（伪 HTML/js）：

<div id="myCenteredDiv" onChangeContents="resizeToNewSize()">
  <!-- div contents -->
</div>

<script type="text/javascript">
  function resizeToNewSize() {
    $("#myCenteredDiv").animateToSize($("#myCenteredDiv").contentWidth, 
      $("#myCenteredDiv").contentHeight);
  }
</script>

我正在寻找“onChangeContents”方法（和/或事件）和“div.contentWidth”属性。

非常感谢您帮助我！

更新：试图更清楚地解释问题

假设我有这个 DIV：

<div id="myDiv">
  <form ...>
    Enter your name: <input id="txtYourName" type="text" name="YourName" value="" />
    <span id="errorYourName"></span>
    <input type="submit" ... />
  </form>
</div>

假设我有这个 jQuery 片段：

$(document).ready(function() {
  $("#txtYourName").live("blur", function() {
    if (validateInput($("#txtYourName").val())) {
      $("#errorYourName").html("");
      // entry 1
    } else {
      // entry 2
      $("#errorYourName").html("This name is not valid.");
    }
  });
});

...在哪里validateInput(value)回报true为有效值。

现在好了。 SimpleModal 插件获取 div 并将其放置在页面中央，并以一定的宽度和高度读取 div 的内容。因此 div 不比输入框宽，因为此时 span 是空的。

当输入框失去焦点时，将在跨度中放入一条错误消息。这会破坏 div 的布局。

我可以将代码放入entry 1当错误消息被清除时，用动画将 div 大小调整回某个大小，然后将代码写入entry 2将 div 调整为更大的尺寸，以便错误消息适合。

但我最想要的是一种方法来判断 div 中的内容是否已更改，并相应地以动画方式自动适应 div。

有任何想法吗？再次感谢。

jQuery：

$(document).ready(function() {

var originalFontSize = 12;

var sectionWidth = $('#sidebar').width();



$('#sidebar span').each(function(){

    var spanWidth = $(this).width();

    var newFontSize = (sectionWidth/spanWidth) * originalFontSize;

    $(this).css({"font-size" : newFontSize, "line-height" : newFontSize/1.2 + "px"});

});

});

</script>

div:

<div id="sidebar">

<span>fits the width of the parent</span><br />

<span>Hello</span><br />

<span>my</span><br />

<span>name</span><br />

<span>is</span><br />

<span>john</span><br />

<span>1</span><br />

<span>23</span><br />

<span>456</span><br />

<span>12345678910</span><br />

<span>the font size in the span adjusts to the width</span><br />

</id>

preview http://jbdes.net/dev/js/fontsize.html