【問題描述】: 點擊輸入框彈出軟鍵盤–>點擊上傳圖片(input type=file)–>此時鍵盤收起 彈出上傳圖片/拍照/取消選項–>點擊取消–>選項消失,鍵盤彈起–>遮擋(如圖二)
【心路歷程】 1.一開始考慮的就是捕獲到那個取消的動作,然而input file點擊取消的時候內容沒改變,并不會觸發change 事件。而且,我在觸發input file之前,綁了一個alert,關閉彈窗后依舊有軟件盤(這是另一部ios8手機上的表現,所以點擊取消只是誘因吧,起一個阻塞的作用,軟鍵盤該出還出來); 2.軟鍵盤與當然與focus、blur事件有關,于是我給所有的input、textarea綁上了focus、blur事件,alert事件名和類名,以此標記。然而之后軟件鍵盤的彈出和收起并不會觸發任何的focus、blur事件。(我開始懷疑人生了。。。難不成是input file,可是它又沒有focus。。); 3.我想竟然我不能通過blur事件把軟件盤收回去,那我就判斷鍵盤是否彈出,把輸入框抬上來好了。然而鍵盤彈出,在ios上并不能觸發resize事件。。(我能怎么辦,我也很絕望啊) 4.難道是客戶端的鍋?于是又去找了ios的開發,他告訴我這鍋不是他的是系統的鍋。。我想,難道是系統還沒反應過來,以為沒收回去,于是加了個延遲觸發,然后。。改好了。。
【解決】 給inpu file的父框綁一個click事件,然后延遲300ms去觸發 input file;
$('#parent').click(function(){ setTimeout(function(){ $('input.pic').trigger('click'); });});【總結】 ①只用input[type=file],內容變化的時候才會觸發change事件; ②input file,沒有focus事件; ③鍵盤彈出,在ios上并不能觸發resize事件。
新聞熱點
疑難解答