Home >Web Front-end >HTML Tutorial >After the HTML page is loaded, adjust the height of the
Suppose I have a textarea element in my HTML and I want to adjust its height based on the content after it loads. How to do it?
1. The textarea element I defined is as follows
<textarea class="form-control" type="text" name="value" id="value" placeholder="输入参数值"></textarea>Note: id = 'value'
The key question here is There are two methods to determine which function will be called after the html is loaded:
2.1 Method 1: By calling $(document).ready(function () {} )
<script type="text/javascript"> function get_text_rows(text) { return text.split("\n").length; } $(document).ready(function () { document.getElementById('value').rows = get_text_rows($('#value').val()); });</script>
<script type="text/javascript"> function get_text_rows(text) { return text.split("\n").length; } window.onload = function() { document.getElementById('value').rows = get_text_rows($('#value').val()); }</script>