• textarea随内容自动增加高度


    var autoTextarea = function (elem, extra, maxHeight) {
    extra = extra || 0;
    var isFirefox = !!document.getBoxObjectFor || 'mozInnerScreenX' in window,
    isOpera = !!window.opera && !!window.opera.toString().indexOf('Opera'),
    addEvent = function (type, callback) {
    elem.addEventListener ?
    elem.addEventListener(type, callback, false) :
    elem.attachEvent('on' + type, callback);
    },
    getStyle = elem.currentStyle ? function (name) {
    var val = elem.currentStyle[name];

    if (name === 'height' && val.search(/px/i) !== 1) {
    var rect = elem.getBoundingClientRect();
    return rect.bottom - rect.top -
    parseFloat(getStyle('paddingTop')) -
    parseFloat(getStyle('paddingBottom')) + 'px';
    };

    return val;
    } : function (name) {
    return getComputedStyle(elem, null)[name];
    },
    minHeight = parseFloat(getStyle('height'));

    elem.style.resize = 'none';

    var change = function () {
    var scrollTop, height,
    padding = 0,
    style = elem.style;

    if (elem._length === elem.value.length) return;
    elem._length = elem.value.length;

    if (!isFirefox && !isOpera) {
    padding = parseInt(getStyle('paddingTop')) + parseInt(getStyle('paddingBottom'));
    };
    scrollTop = document.body.scrollTop || document.documentElement.scrollTop;

    elem.style.height = minHeight + 'px';
    if (elem.scrollHeight > minHeight) {
    if (maxHeight && elem.scrollHeight > maxHeight) {
    height = maxHeight - padding;
    style.overflowY = 'auto';
    } else {
    height = elem.scrollHeight - padding;
    style.overflowY = 'hidden';
    };
    style.height = height + extra + 'px';
    scrollTop += parseInt(style.height) - elem.currHeight;
    document.body.scrollTop = scrollTop;
    document.documentElement.scrollTop = scrollTop;
    elem.currHeight = parseInt(style.height);
    };
    };

    addEvent('propertychange', change);
    addEvent('input', change);
    addEvent('focus', change);
    change();
    };
    var text = document.querySelectorAll("textarea");
    for(var a=0;a<text.length;a++){
    autoTextarea(text[a])
    }

  • 相关阅读:
    实现Bootstrap表格拖拽
    鼠标悬停显示气泡
    JS实现当前选择日期是星期几
    JS实现双击编辑可修改
    数组累计-reduce
    vuex——action,mutation,getters的调用
    正则 二
    常用正则 一
    vuex 的使用 mapState, mapGetters, mapMutations, mapActions
    正则替换所有的 ‘ / ’
  • 原文地址:https://www.cnblogs.com/sunjinggege/p/7048873.html
Copyright © 2020-2023  润新知