摘要：解決方案探究開發(fā)過的人都知道，在手機(jī)下面處于安全策略考慮，不允許自動(dòng)獲取輸入框的焦點(diǎn)并調(diào)出虛擬鍵盤，可是從產(chǎn)品角度來看，往往這樣的場景有很多，所以也催生出各種各樣的手段，下面介紹一種自認(rèn)為是挺完美的方案供大家參考業(yè)務(wù)場景描述頁面點(diǎn)擊搜索按鈕

開發(fā)過hybird的人都知道，在IOS手機(jī)下面處于安全策略考慮，不允許JS自動(dòng)獲取input輸入框的焦點(diǎn)并調(diào)出虛擬鍵盤，可是從產(chǎn)品角度來看，往往這樣的場景有很多，所以也催生出各種各樣的hack手段，下面介紹一種自認(rèn)為是挺完美的方案供大家參考：

A頁面點(diǎn)擊搜索按鈕，跳到B頁面，B頁面的搜索框自動(dòng)獲取焦點(diǎn)并且彈出虛擬鍵盤。

基于vue（其他框架類似）設(shè)計(jì)如下：

A、B頁面都是不同的路由頁面；

在A、B頁面公共部分添加一個(gè)公共input隱藏輸入框并設(shè)置唯一id；

將A頁面的搜索按鈕包一層label節(jié)點(diǎn)，并設(shè)置for屬性指向公共input的id，并設(shè)置click事件跳轉(zhuǎn)到B頁面；

在B頁面的beforeMount中添加監(jiān)聽公共input的input事件，并在監(jiān)聽的回調(diào)函數(shù)里面去賦值給B頁面真正用于顯示的input框；

這樣就結(jié)束了，當(dāng)我們點(diǎn)擊A頁面的搜索按鈕會(huì)觸發(fā)label for特性顯示虛擬彈窗，并跳轉(zhuǎn)到B頁面，然后直接按虛擬按鍵即可完成公共隱藏輸入框和真正輸入框之間的值的同步賦值；

以最少的代碼完成hack

以最少的改動(dòng)完成hack

唯一的缺點(diǎn)是不能讓B頁面的輸入框一開始的時(shí)候有一個(gè)光標(biāo)，這個(gè)建議可以寫一個(gè)通用的input組件，通過CSS hack方式模擬光標(biāo)顯示

OK，到這里就結(jié)束了方案設(shè)計(jì)了，希望這個(gè)思路可以給大家一個(gè)參考。