• sencha touch textarea 手机上不显示滚动条,且不能滚动


    最近在项目中发现 sencha touch 中的 textarea 在手机上不显示滚动条,也不能滚动。

    在浏览器中之所以能显示滚动条滚动,那是浏览器为 textarea 添加的滚动条。 但在手机中是不会显示滚动条的。 可能在以后的版本中会有所改进吧。

    于是只能另想办法了,找了一个老外重写的可滑动的 textarea (无滚动条)。

    转:

    Ext.define('LeslieTest.view.TextArea',
    {
        extend : 'Ext.field.TextArea',
        xtype : 'scrollTextArea',
        
        initialize : function() {
            this.callParent();
            this.element.dom.addEventListener(
                    Ext.feature.has.Touch ? 'touchstart'
                            : 'mousedown',
                    this.handleTouchListener = Ext.bind(
                            this.handleTouch, this), false);
            this.element.dom.addEventListener(
                    Ext.feature.has.Touch ? 'touchmove'
                            : 'mousemove',
                    this.handleMoveListener = Ext.bind(
                            this.handleMove, this), false);
            this.moveListenersAttached = true;
        },
        
        destroy : function() {
            if (this.moveListenersAttached) {
                this.moveListenersAttached = false;
                this.element.dom.removeEventListener(
                        Ext.feature.has.Touch ? 'touchstart'
                                : 'mousedown',
                        this.handleTouchListener, false);
                this.element.dom.removeEventListener(
                        Ext.feature.has.Touch ? 'touchmove'
                                : 'mousemove',
                        this.handleMoveListener, false);
                this.handleTouchListener = this.handleMoveListener = null;
            }
            this.callParent();
        },
        
        handleTouch : function(e) {
            this.lastY = e.pageY;
        },
        
        handleMove : function(e) {
            var textArea = e.target;
            var top = textArea.scrollTop <= 0;
            var bottom = textArea.scrollTop + textArea.clientHeight >= textArea.scrollHeight;
            var up = e.pageY > this.lastY;
            var down = e.pageY < this.lastY;
            this.lastY = e.pageY;
    
            if ((top && up) || (bottom && down))
                e.preventDefault();
    
            if (!(top && bottom))
                e.stopPropagation();
        }
    });

      

  • 相关阅读:
    【json的处理】一、Gson处理
    【校验处理】三、Spring Validation 校验处理
    【校验处理】二、SpringBoot Validate 统一处理
    【校验处理】一、Java Bean Validation验证
    div 固定宽高 水平垂直居中方法
    vue 修改ElementUI样式(非全局修改)
    js --- execCommand('copy')复制文本到剪切板换行符不生效
    C#枚举(一)使用总结以及扩展类分享
    php执行时长
    关于PHP的编码格式导致的乱码
  • 原文地址:https://www.cnblogs.com/lesliefang/p/3477471.html
Copyright © 2020-2023  润新知