处理移动端iframe中input框的一些总结

最近项目中的移动端使用iframe作为字容器，在处理input遇到一下一些问题。

1、点击input时，input不会自动显示在键盘上方。

解决方法：当focus将输入框呈现在可视位置。

$("iframe").contents().on('focus',"input[type=\"text\"],textarea", function(){
    var target = this;
    setTimeout(function(){
        target.scrollIntoViewIfNeeded();
    },200);
})

2、点击input不想弹出键盘

2.1、在处理一些input时比如日期组件，往往不希望键盘弹出。

解决方法：focus时input失焦

$("iframe").contents().on("focus",".timeInput, .time-input, .date-input, .timeInput",function(){
    document.activeElement.blur();
})

2.2、在自带扫码枪(PDA)的设备上点击输入框不显示键盘

解决方法：
第一步：点击input时先失焦，然后focus。
第二步：当focus时先设置readonly去掉readonly，为了防止键盘弹出过快，使用setTimeout延迟remove readonly。

兼容性：