問題
- 問題有兩個
- 在用戶觸發(fā)的瀏覽器事件中,異步的使用window.open開啟一個新的tab失敗
- 在用戶觸發(fā)的瀏覽器事件中,異步的使用js代碼調(diào)用form表單的提交function失敗
解決問題1
- 由于safari不能接受異步的window.open,那么我們首先同步的window.open一個空白的tab,然后獲取新tab的window對象的引用(window.open()的返回值就是新tab window對象的引用)
- 處理異步事件
- 處理完之后將想要跳轉(zhuǎn)的url賦值給新tab的window.location.href給出想要跳轉(zhuǎn)的新數(shù)值即可
const newTab = window.open('')
setTimeout(() => {
newTab.location.
}, 3000)
補(bǔ)充知識
- window.open的用法
- 作用:打開一個新的窗體
- 返回值:新窗體window對象的引用
- 參數(shù)
- 第一個:就是新窗體url
- 第二個:用于設(shè)置彈出窗體的名稱,如果使用已有的窗體或框架名稱作為name參數(shù),那么url網(wǎng)址將在這個窗體或框架頁面載入
- 第三個:就是一些窗口的屬性了
- -----> 第二個參數(shù)相對比較不常用但是很有用
- 使用舉例:
<button onclick={()=>{window.open('','newTab')}}/> <a href='www.baidu.com' target='newTab' /> //可以通過給tab創(chuàng)建一個窗口名,然后很多target的值都可以指向這個窗口名,就可以在指定的tab中打開頁面
解決問題2
- 早就知道大家都采用同步打開新tab,異步給tab賦url的方式解決safari的這個問題
- 但是發(fā)現(xiàn)自己的情況是要做到表單提交而表單提交打開新的tab并不是又我自己來做的,因此我也不能夠控制他同步打開然后異步賦值
- 直到發(fā)現(xiàn)window.open有第二個參數(shù)
- 因此依舊是同步的打開一個tab
window.open('','newPay')
但是一定要給第二個參數(shù)值 - 然后將form標(biāo)簽的target屬性值設(shè)置為
window.open('','newPay')
的第二個參數(shù)。就可以在同步打開的tab中l(wèi)oad form submit的結(jié)果
- 因此依舊是同步的打開一個tab