UIWebView)WKScriptMessageHandler(只适用于WKWebView,iOS8+)Bridge第三方框架(适用于UIWebView和WKWebView)1. url拦截url拦截是在H5 请求一个地址后,客户端拦截住这个地址,对地址进行解析处理H5中调用iOS方法代码:弹出登录弹窗(拦截url)iOS中拦截到url代码:- (BOOL (app方法名).postMessage() H5代码<body> <input type="button" name="" value="登录" onclick="login()"><script type WKWebView alloc] initWithFrame:self.view.frame configuration:config]; webView.UIDelegate = self;}// H5 JavaScriptInterfaceH5端代码<body> <input type="button" name="" value="登录" onclick="login()"><script type
-- 多选文件 -->
<input type="file" multiple>
忽略自动识别
有些移动端浏览器会自动将数字字母符号识别为电话/邮箱并将其渲染成上述调用系统功能里的。
query],笔者曾经发表过《H5与App的通讯方式》讲述URL Scheme的使用。
鉴于该方案的成功,其他移动端浏览器也复制了该方案,现在几乎所有移动端浏览器都配备该功能。而该方案引发的点击延迟被称为点击穿透。
通常移动端浏览器都会配备长按二维码图片识别链接的功能,但长按二维码可能无法识别或错误识别。
使用渲染
使用<svg>渲染
使用<canvas>渲染
复制代码
经过网易MTL测试的数据显示,大部分移动端浏览器只能识别渲染的二维码,为了让全部移动端浏览器都能识别二维码,那只能使用渲染二维码了
html 篇 常用的meta属性设置 meta对于移动端的一些特殊属性,可根据需要自行设置 <meta name="screen-orientation" content="portrait"> // 同样地,我们也可以通过标签属性来开启长按邮箱地址弹出邮件发送的功能: dooyoe@gmail.com css 篇 0.5px细线 移动端 H5 项目越来越多,设计师对于 UI 的要求也越来越高,比如 1px 的边框。 在高清屏下,移动端的 1px 会很粗。 那么为什么会产生这个问题呢? body { overflow-y: hidden; } .wrapper { overflow-y: auto; } js 篇 移动端click屏幕产生200-300 ms的延迟响应 移动设备上的