微信浏览器中Input的兼容性处理

简介: 微信浏览器中Input的兼容性处理

正文


  1. 在 iOS 上输入框默认样式会有内阴影,无法通过 box-shadow: none 去除,可通过以下方式处理。

input {
  -webkit-appearance: none;
}


  1. 在微信浏览器中部分 iOS 设备在输入框失焦时,页面无法正常回弹,可通过在 input 失焦事件加上:

function blurHandler() {
  setTimeout(() => {
    const scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0
    window.scrollTo(0, Math.max(scrollHeight - 1, 0))
  }, 0)
}


目录
相关文章
|
6月前
|
移动开发 小程序 API
微信外部浏览器或短信链接唤起微信小程序的解决方案
微信外部浏览器或短信链接唤起微信小程序的解决方案
1470 1
|
6月前
|
Web App开发 编解码 前端开发
面试题22:如何测试Web浏览器的兼容性?
面试题22:如何测试Web浏览器的兼容性?
156 3
|
6月前
|
小程序 JavaScript
【微信小程序】-- WXML 模板语法 - 事件绑定 -- tap & input (十)
【微信小程序】-- WXML 模板语法 - 事件绑定 -- tap & input (十)
|
小程序
【组件】微信小程序input搜索框的实现
【组件】微信小程序input搜索框的实现
234 0
|
Web App开发 前端开发 JavaScript
跨浏览器兼容性:确保您的网站在各个平台上无缝运行
在当今多样化的网络浏览器市场中,确保您的网站能够在不同浏览器上正常运行变得至关重要。跨浏览器兼容性是一项关键任务,涉及到确保您的网站在不同浏览器和设备上都提供一致的用户体验。本博客将深入探讨跨浏览器兼容性的重要性、挑战以及如何实施有效的兼容性策略。
209 0
|
JavaScript
js判断是否微信PC端打开内置浏览器
js判断是否微信PC端打开内置浏览器
|
1月前
|
Web App开发 前端开发 JavaScript
|
1月前
|
Web App开发 移动开发 前端开发
H5微信外支付(移动端浏览器)
H5微信外支付(移动端浏览器)
38 0
 H5微信外支付(移动端浏览器)
|
1月前
|
小程序 JavaScript
微信小程序之input组件及其获取用户输入信息
微信小程序之input组件及其获取用户输入信息
56 1
|
3月前
|
XML 小程序 JavaScript

热门文章

最新文章

下一篇
无影云桌面