Kotak teks lalai dalam penyemak imbas tidak boleh bertambah tinggi apabila kandungannya meningkat. Ia hanya boleh mempunyai ketinggian tetap dengan bar skrol. Saya telah mencuba banyak kaedah untuk menjadikannya serasi akhirnya menemui kaedah dengan keserasian yang baik:
<body> <textarea id="textarea3" style="overflow-y:hidden; height:20px;resize: none"> </textarea> <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script> <script type="text/javascript"> $(function() { //最小高度和最大高度默认 $("#textarea1").textareaAutoHeight(); //最大高度为100px $("#textarea2").textareaAutoHeight({maxHeight: 100}); //最小高度为50px,最大高度为200px $("#textarea3").textareaAutoHeight({minHeight: 50, maxHeight: 200}); }) $.fn.extend({ textareaAutoHeight: function(options) { this._options = { minHeight: 0, maxHeight: 1000 } this.init = function() { for (var p in options) { this._options[p] = options[p]; } if (this._options.minHeight == 0) { this._options.minHeight = parseFloat($(this).height()); } for (var p in this._options) { if ($(this).attr(p) == null) { $(this).attr(p, this._options[p]); } } $(this).keyup(this.resetHeight).change(this.resetHeight) .focus(this.resetHeight); } this.resetHeight = function() { var _minHeight = parseFloat($(this).attr("minHeight")); var _maxHeight = parseFloat($(this).attr("maxHeight")); if (!$.browser.msie) { $(this).height(0); } var h = parseFloat(this.scrollHeight); h = h < _minHeight ? _minHeight :h > _maxHeight ? _maxHeight : h; $(this).height(h).scrollTop(h); if (h >= _maxHeight) { $(this).css("overflow-y", "scroll"); } else { $(this).css("overflow-y", "hidden"); } } this.init(); } }); </script> </body>
Di atas adalah keseluruhan kandungan artikel ini saya harap ia akan membantu semua orang dalam mempelajari pengaturcaraan jquery.