• textarea 的最大高度以及最小高度


    1.textarea  高度自适应

    function makeExpandingArea(el) {
        var setStyle = function(el) {
            el.style.height = 'auto';
            el.style.height = (el.scrollHeight-8) + 'px';
            console.log(el.scrollHeight);
        }
        var delayedResize = function(el) {
            window.setTimeout(function() {
                setStyle(el)
            },
            0);
        }
        if (el.addEventListener) {
            el.addEventListener('input',function() {
                setStyle(el)
            },false);
            setStyle(el)
        } else if (el.attachEvent) {
            el.attachEvent('onpropertychange',function() {
                setStyle(el)
            });
            setStyle(el)
        }
        if (window.VBArray && window.addEventListener) { //IE9
            el.attachEvent("onkeydown",function() {
                var key = window.event.keyCode;
                if (key == 8 || key == 46) delayedResize(el);
    
            });
            el.attachEvent("oncut",function() {
                delayedResize(el);
            }); //处理粘贴
        }
    }
    $(function(){
        
        var sen=document.getElementsByClassName("report_txt");
        
        [].slice.call(sen).map(function(a){
            makeExpandingArea(a);
        })
        
    })

    2.最小高度和最大高度默认

    <script type="text/javascript">
    $(function(){
    $("#textarea3").textareaAutoHeight({ minHeight:25, maxHeight:69 });
    })
    //最小高度和最大高度默认

    //最大高度为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>

  • 相关阅读:
    hihoCoder #1078 : 线段树的区间修改
    hihoCode r#1077 : RMQ问题再临-线段树
    hihoCoder #1070 : RMQ问题再临
    hihoCoder #1068 : RMQ-ST算法(模板)
    LeetCode Valid Sudoku 有效数独
    150 Evaluate Reverse Polish Notation 逆波兰表达式求值
    149 Max Points on a Line 直线上最多的点数
    148 Sort List 链表上的归并排序和快速排序
    147 Insertion Sort List 链表插入排序
    146 LRU Cache 最近最少使用页面置换算法
  • 原文地址:https://www.cnblogs.com/songrimin/p/4460876.html
Copyright © 2020-2023  润新知