Question

我正在开发一个页面，需要反复从我的数据库中获取更新的数据。出于测试目的，我只有一个固定高度的div。我可以使用.load（）方法更新div中的文本，但是，我需要将div的高度调整为从数据库返回的数据的值。

我事先感谢你的帮助！

<body>
<div id="status" >This is a TEST</div>

<script type="text/javascript"src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js">   
</script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('#status').load('check_status.php').fadeIn("slow");
}, 5000); // refresh every 5000 milliseconds
</script>
</body>

Answer 1

如果您想让div #status符合其内容

- ＆gt;。添加CSS：

#status{
  display:block;
  overflow:auto;
  height:auto;
}

如果你担心设置高度与内容成比例，你可以这样做：

function calculateHeight(dataSize){
   //i.e (0.7%)
   return dataSize*0.07;

};
$.get('check_status.php',function(data){
    let element=$('#status');
    element.css('height',calculateHeight(data.length)+'px');
    element.fadeIn('slow');
});

每隔5秒使用MYSQL数据库中的数据更改div的高度

1 个答案: