在原生js中如果要模擬事件其實比較麻煩的事情,因爲要考慮到各個瀏覽器對dom標準的兼容,同時還要進行多個步驟(創建event對象、初始化、正式觸發等步驟)。不過jquery就有一個非常簡單好用的click()或者trigger('click')方法來模擬點擊事件
這兩個方法可以說是非常簡單好用了。但是這裏我其實要說的是這個方法的一點問題。
問題出現的場景是:當某個元素的點擊事件需要經過判斷後才觸發時——也就是在點擊後需要延遲一定時間的情況下,click()或者trigger()方法無法再觸發click事件
比如一個<input type="file">元素,如下圖:
如果我們要在點擊‘判斷權限’按鈕後發送一個請求到後臺,並在確認權限後用click()或trigger('click')觸發<input type="file">元素的click來選擇文件。那麼很有可能在請求返回後完全觸發不了<input type="file">元素的click事件,也不能選擇文件。
幾次遇到這種情況,後來我用setTimeout();模擬了類似的情況。代碼如下:
setTimeout(function(){
$(".fileInput").click();
}, 1000);
通過運行以上js代碼我發現,只要延時超過1s,click事件就觸發不了。想了很久沒有想通爲什麼,也沒有研究過jquery源碼(當然同樣的情況可能在使用原生方法模擬click事件時也存在)。
有沒有知道的同學來交流一下。