有一个苹果6S的兼容性问题

以前作项目的时候，有一个页面有个短信验证，须要输入验证码，而后验证，可是在苹果6s手机上面，点击输入验证码框的时候，竟然触发了页面刷新，测试了其余的型号，安卓的华为，oppo等，ios8等都正常，只有2个同事的苹果6s的有这种状况。

测试了不少中方式：以下：

（1）

<div id="mobile_check_div" style="width:100%; display: none">
    <div class="alert_span"><span >当前客户非您名下客户，查询需先进行短信验证</span></div>
    <div class="weui-cells">
        <div class="weui-cell">
            <div class="weui-cell__bd" >
                <p>客户手机号</p>
            </div>
            <div class="weui-cell__ft" style="width: 80%;"><span style="    margin-right: 23%;" id="mobile_num"></span><input type="button" value="发送验证码" id="sendMobileCode" style="height: 25px;border-radius: 5px;" onclick="sendMobileCode()" /></div>
        </div>
        <div class="weui-cell">
            <div class="weui-cell__bd">
                <p>短信验证码</p>
            </div>
            <div class="weui-cell__ft" style="width: 60%;">
                <input type="search"  maxlength="6" onclick="returnFunction()" style="height: 30px;width: 100%;border: 0px;"  id="mobileCode" placeholder="请输入客户收到的验证码"/>
                &lt;%&ndash;<input type="search" class="weui-search-bar__input" id="mobileCode" onclick="returnFunction()" placeholder="请输入客户收到的验证码" required="">&ndash;%&gt;
            </div>
        </div>
    </div>
    <div style="padding-bottom:10px;"><input type="button" id="mobile_check_button" value="验证"  style="width: 40%;height: 30px;margin: 25px 0 0 35%;border-radius:5px;" onclick="checkCode()"></div>
    &lt;%&ndash;<div>
    <input type="hidden" id="mobile_hidden" value="">
    <div class="alert_span"><span >如客户电话信息有变动，请通知客户联系客服在系统中更新后，再进行查询操做，感谢！</span></div>
</div>

（2）

<div id="mobile_check_div" style="width:100%; display: none">
    <div class="alert_span"><span >当前客户非您名下客户，查询需先进行短信验证</span></div>
         <table style="width: 100%;height:100px;">
             <tr><td style="width: 100%;">客户手机号 : </td> </tr>
             <tr><td style="width: 100%;">短信验证码:<input type="search"  maxlength="6" onkeyup="returnFunction()" style="margin-left: 10%;height: 50%;width: 50%;border: 0px;"  id="mobileCode" placeholder="请输入客户收到的验证码"/></td></tr>
         </table>
         <div style="padding-bottom:10px;"><input type="button" id="mobile_check_button" value="验证"  style="width: 40%;height: 30px;margin: 25px 0 0 35%;border-radius:5px;" onclick="checkCode()"></div>
     </div>&ndash;%&gt;
    <input type="hidden" id="mobile_hidden" value="">
    <div class="alert_span"><span >如客户电话信息有变动，请通知客户联系客服在系统中更新后，再进行查询操做，感谢！</span></div>
</div>

 

（3）

<div id="check_div">
    <div style="font-size: 10px;color: #5f646e;"><span>当前客户非您名下客户，查询需先进行短信验证</span></div>
    <div>
        <table style="width: 100%;">
            <tbody>
                <tr><td style="width: 100%;padding-top: 5px;">客户手机号 : <span style="margin-left: 8%;" id="mobile_num"></span><input type="button" value="发送验证码" id="sendMobileCode" style="margin-left: 8%;width: 75px;height: 25px;border-radius: 5px;" onclick="sendMobileCode()"></td> </tr>
                <tr><td style="width: 100%;padding-top: 5px;">短信验证码:<input type="text" maxlength="6" style="margin-left: 10%;height: 20px;width: 50%;border: 0px;" id="mobileCode" placeholder="请输入客户收到的验证码"></td></tr>
            </tbody>
        </table>
        <div><input type="button" id="mobile_check_button" value="验证" style="width: 33%;height: 30px;margin: 25px 0 20px 35%;" onclick="checkCode()"></div>
    </div>
    <input type="hidden" id="mobile_hidden" value="">
    <div class="alert_span"><span >如客户电话信息有变动，请通知客户联系客服在系统中更新后，再进行查询操做，感谢！</span></div>
</div>

 

发现这几种方式都不行，点击输入框的时候都会刷新，或者是点击输入框出现键盘的时候，上面有完成按钮，或者是上下箭头的点击时候致使刷新，

后发现另外一个地方有输入框没有致使此种现象，故采用这中方式整改以下代码：

<div id="check_div" style="display: none;">
    <div style="font-size: 10px;color: #5f646e;"><span >当前客户非您名下客户，查询需先进行短信验证</span></div>
    <div>
        <table style="width: 100%;">
            <tr><td style="width: 100%;">客户手机号 : <span style="margin-left: 8%;" id="mobile_num"></span><input type="button" value="发送验证码" id="sendMobileCode" style="margin-left: 8%;width: 75px;height: 25px;border-radius: 5px;" onclick="sendMobileCode()" /></td> </tr>
            <tr><td style="width: 100%;">短信验证码:<input type="text"  maxlength="6" style="margin-left: 10%;height: 100%;width: 50%;border: 0px;"  id="mobileCode" placeholder="请输入客户收到的验证码"/></td></tr>
        </table>
        <div><input type="button" id="mobile_check_button" value="验证"  style="width: 33%;height: 30px;margin: 25px 0 0 35%;" onclick="checkCode()"></div>
    </div>
    <input type="hidden" id="mobile_hidden" value="">
</div>
<div style="font-size: 10px;color: #5f646e;"><span >如客户电话信息有变动，请通知客户联系客服在系统中更新后，再进行查询操做，感谢！</span></div>

 

此种兼容性的问题就没有出现了，点击输入框，仍是点击出现的键盘上的完成按钮，上下箭头按钮，都不会致使刷新了。

至此问题虽然解决了，可是我仍是不知道什么致使的苹果6s出现这种兼容性的问题，我这种方式为何能够解决这个兼容性的现象，但愿有大神能够帮我解惑！！！