你的位置:首页 > 软件开发 > 操作系统 > 移动端开发:iOS与Android平台上问题列表

移动端开发:iOS与Android平台上问题列表

发布时间:2017-06-23 00:00:33
要CSS伪类 :active 生效,只需要给 document 绑定 touchstart 或 touchend 事件<style>a { color: #000;}a:active { color: #fff;}</style><a herf=fo ...

要CSS伪类 :active 生效,只需要给 document 绑定 touchstart 或 touchend 事件

<style>a { color: #000;}a:active { color: #fff;}</style><a herf=foo >bar</a><script> document.addEventListener('touchstart',function(){},false);</script>

而如果中间的 code 需要处理的东西多的话,FPS 就会下降影响程序顺滑度,而如果改成这样

 

关于 Android WebView中,input 元素输入时出现的怪异情况

见图

移动端开发:iOS与Android平台上问题列表

Android web视图,例如在 HTC EVO 和三星的 Galaxy Nexus 中,文本输入框在输入时表现的就像占位符。情况为一个类似水印的东西在用户输入区域,一旦用户开始输入便会消失(见图片)。

在 Android 的默认样式下当输入框获得焦点后,若存在一个绝对定位或者fixed的元素,布局会被破坏,其他元素与系统输入字段会发生重叠(如搜索图标将消失为搜索字段),可以观察到布局与原始输入字段有偏差(见截图)。 这是一个相当复杂的问题,以下简单布局可以重现这个问题:

 

解决方法

 

详细:Androdi开发刘亚超WebView视频教程  http://www.gooln.com/zip/124870.html  该属性会导致中文不能输入词组,只能单个字。感谢鬼哥与飞(游勇飞)贡献此问题与解决方案

JS 动态生成的 select 下拉菜单在 Android2.x 版本的默认浏览器里不起作用

解决方法删除了 overflow-x:hidden; 然后在JS生成下来菜单之后 focus 聚焦,这两步操作之后解决了问题。(来自岛都-小Qi)

移动端 HTML5 audio autoplay 失效问题

这个不是 BUG,由于自动播放网页中的音频或视频,会给用户带来一些困扰或者不必要的流量消耗,所以苹果系统和安卓系统通常都会禁止自动播放和使用 JS 的触发播放,必须由用户来触发才可以播放。

解决方法思路:先通过用户 touchstart 触碰,触发播放并暂停(音频开始加载,后面用 JS 再操作就没问题了)。

解决代码:

 

移动端 HTML5 input date 不支持 placeholder 问题

input type date 的 placeholder 支持性有一定问题,因为浏览器会针对此类型 input 增加 datepicker 模块,看上去没那么必要支持 placeholder。

对 input type date 使用 placeholder 的目的是为了让用户更准确的输入日期格式,iOS 上会有 datepicker 不会显示 placeholder 文字,但是为了统一表单外观,往往需要显示。Android 部分机型没有 datepicker 也不会显示 placeholder 文字。

简单的进行了测试:

桌面端(Mac)

  • Safari 不支持 datepicker,placeholder 正常显示。
  • Firefox 不支持 datepicker,placeholder 正常显示。
  • Chrome 支持 datepicker,显示 年、月、日 格式,忽略 placeholder。

移动端

  • iPhone5 iOS7 有 datepicker 功能,但是不显示 placeholder。
  • Andorid 4.0.4 无 datepicker 功能,不显示 placeholder

问题解决方法:

先使其 type 为 text,此时支持 placeholder,当触摸或者聚焦的时候,使用 JS 切换使其触发 datepicker 功能。

 
function showDropdown(sltElement) {  var event;  event = document.createEvent('MouseEvents');  event.initMouseEvent('mousedown', true, true, window);  sltElement.dispatchEvent(event);};

原标题:移动端开发:iOS与Android平台上问题列表

关键词:Android

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录