h5 摇一摇 iOS中输入验证码撤销弹框问题

逻辑：输入验证码，判断正确，参与摇一摇活动

问题：输入正确的验证码，摇一摇的时候，出现弹框,“是否撤销键入”，影响客户体验。

查找方法：1）分割页面，将带页面分割成，带输入框的页面，和摇一摇活动界面。需要重新

设计

2）将输入框分为两个，一个放在页面显示，一个是输入时记录验证码。

将验证码输入框，通过iframe引入到页面对应位置，输入完成后，删除iframe

页面上隐藏的加的input显示，给显示的input绑定一个方法，当input被点击的

时候，再次引入iframe ，绑定相应事件，在iframe 加载完成后，让真的输入

框获取焦点，避免需要用户点击两次。

tip:

1、引入iframe ，src 为引入的html

<iframe src="input.html" id="iframeId" height="250" width="250"></iframe>

2、父页面获取子页面的元素

window.onload = function(){

var _iframe = document.getElementById('iframeId').contentWindow;

var _div =_iframe.document.getElementById('objId');

_div.style.backgroundColor = '#ccc';

}

参考：http://www.jb51.net/article/89931.htm

jQuery 获取iframe元素的方法：

// 获取iframe的test元素 

var obj = $("#iframeId").contents().find("#test"); 

问题：获取元素的时候，需要在页面加载完成后去获取，否则可能为空或获取的不是正确数据。

 若iframe是在父元素的页面中写入的，可在父元素的js的window.onload 方法中获取。

本例中，允许多次输入，多次参与活动，故后面需要在js中重新添加iframe，并获取相应元素

添加绑定事件，此时需要等到iframe页面加载完成：

 $("#iframeId").load(function(){   

        $("#message").click(function(){

});   

       }); 

3、

  在页面中查找 iframe 页面元素：$("#iframe").contents().find("#id")

在 iframe 中查找父页面元素：$("#id", parent.document)