Jquery melaksanakan ketinggian penyesuaian textarea mengikut kandungan teks_jquery

Satu perincian yang mungkin kami perhatikan semasa bermain Weibo ialah ketinggian kotak teks lalai yang diberikan kepada anda oleh Sina Weibo atau Tencent Weibo apabila memajukan dan mengulas Ini mungkin disebabkan oleh pengehadan berkaitan dengan fakta bahawa pengguna biasanya hanya menyiarkan semula atau mengulas pada ayat pendek. Tetapi apabila anda memasukkan lebih daripada satu baris teks, ketinggian kotak teks dinaikkan secara automatik, yang sangat meningkatkan pengalaman supaya pengguna dapat melihat semua teks. Tidak perlu menyeret bar skrol kotak teks.

autoTextarea.js

(function($){
  $.fn.autoTextarea = function(options) {
    var defaults={
      maxHeight:null,
      minHeight:$(this).height()
    };
    var opts = $.extend({},defaults,options);
    return $(this).each(function() {
      $(this).bind("paste cut keydown keyup focus blur",function(){
        var height,style=this.style;
        this.style.height = opts.minHeight + 'px';
        if (this.scrollHeight > opts.minHeight) {
          if (opts.maxHeight && this.scrollHeight > opts.maxHeight) {
            height = opts.maxHeight;
            style.overflowY = 'scroll';
          } else {
            height = this.scrollHeight;
            style.overflowY = 'hidden';
          }
          style.height = height + 'px';
        }
      });
    });
  };
})(jQuery);

demo.js

$(".doctable textarea").autoTextarea({
  maxHeight:400,
  minHeight:100
});

Di atas adalah keseluruhan kandungan artikel ini, saya harap ia dapat membantu semua orang mempelajari jQuery.