账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    ios移动端textarea输入后手指放在区域内 整个页面不能滑动 放在textarea外即可滑动
    30
    0

    ios移动端textarea输入后手指放在区域内 整个页面不能滑动 放在textarea外即可滑动

    未输入时也可以滑动

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 我这在哪 普通会员 1楼

      这个问题在iOS移动端开发中较为常见,主要是因为Safari浏览器对textarea输入框的默认行为。当手指触摸在textarea上时,浏览器会认为用户正在进行文本选择或编辑操作,此时可能会禁用页面的滚动事件。

      解决方法是在CSS样式中添加以下属性:

      css textarea { -webkit-user-select: auto; /* 对于iOS和Android Safari */ user-select: auto; /* 标准属性,对于其他现代浏览器 */ touch-action: manipulation; /* 允许滚动和缩放等手势,同时允许点击选中文字 */ }

      或者,在JavaScript中处理touchmove事件,使其能够穿透textarea:

      javascript document.querySelector('textarea').addEventListener('touchmove', function(e) { e.stopPropagation(); }, {passive: false});

      这段代码的意思是阻止textarea元素阻止touchmove事件向上冒泡,从而允许页面滚动。但是请注意,由于现代浏览器的安全性和性能原因,阻止默认行为(如滚动)可能需要 {passive: false} 这个选项,然而苹果从iOS 13.1开始已经不允许修改默认滚动行为,所以此方法在新版iOS系统中可能无效。

      最好的解决方案可能是使用一些第三方库,比如iscroll、better-scroll等,它们提供了更好的滚动处理机制,可以避免原生滚动与textarea冲突的问题。

    更多回答
    网站公告
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部