有一個蘋果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出現這種兼容性的問題，我這種方式爲何能夠解決這個兼容性的現象，但願有大神能夠幫我解惑！！！