這是最近在做個(gè)人播客系統(tǒng)出現(xiàn)的一個(gè)問題,

場(chǎng)景如下 ：

圖中我點(diǎn)擊刪除按鈕之后, 彈出一個(gè)模態(tài)框讓我選擇是回首頁還是, 上一頁, 下一頁

首頁沒什么好說的了, 就是直接跳轉(zhuǎn), 沒什么問題

上一頁, 下一頁卻是跳轉(zhuǎn)到上一篇 或者下一篇, 所有的”文章“都是用的是同一個(gè)html模板, 所以頁面沒有重新加載
于是就出現(xiàn)了 上面的問題, 模態(tài)框消失了, 但是背景卻沒有消失

對(duì)于這個(gè)問題, 我在網(wǎng)上找了好一陣子, 但是貌似并沒有相關(guān)的問題

1 所以之前我本來是想將這個(gè)問題簡(jiǎn)單化, 直接"location = prevUrl; location.reload() ", 但是 這樣有感覺不合適, 請(qǐng)求兩次， 對(duì)于某些某些沒有緩存的數(shù)據(jù) 是比較浪費(fèi)的

所以 后來一直在網(wǎng)上找啊找, 但是沒什么用…

2 后來嘗試了一下在按鈕的事件 “開始 / 結(jié)束” 的地方加上$(“#myModal”).modal({show : true}), / $(“#myModal”).modal({backdrop:false, show : true}) / $(“#myModal”).modal(“hide”) 等等
但是仍然沒有什么用

3 后來靈機(jī)一現(xiàn), 我何不看看這個(gè)存在背景的html 和普通當(dāng)前頁面的html有什么改變呢, 說不能就能找到問題所在,, 哼哼 果然如此

go [圖戰(zhàn)開始]

1) 這是頁面正常的時(shí)候

2) 這里是模態(tài)框出來的時(shí)候

3) 然后 我點(diǎn)擊了上一頁

相比于原始頁面”1)” 1. 多了一個(gè)div, 2. 以及body加上了一個(gè)class屬性

4) 然后我刪除了div

與上面的頁面的變化在于頁面的那個(gè)背景不存在了, 但是我現(xiàn)在鼠標(biāo)任然不能控制頁面的移動(dòng)

5) 然后我刪除了body的class屬性

遇上一個(gè)頁面相比, 我現(xiàn)在能夠動(dòng)鼠標(biāo)了, 變回了正常的頁面

問題解決

nice, 原來解決掉這兩個(gè)地方就可以了啊, fix it !

這個(gè)問題的真正原因, 我不知道, 也就是為什么在這種場(chǎng)景下面會(huì)產(chǎn)生這種情況

參考 :

1、//m.fzitv.net/article/32590.htm

2、http://www.runoob.com/bootstrap/bootstrap-v2-modal-plugin.html

3、百度知道：如何控制模態(tài)窗口提交后，模態(tài)窗口關(guān)閉，跳轉(zhuǎn)回主頁面，而不是另開一個(gè)頁面？

模態(tài)窗口中內(nèi)嵌一個(gè)iframe 在iframe中寫后臺(tái)代碼， 然后可以用js控制模態(tài)窗口的關(guān)閉或跳轉(zhuǎn)。

更多內(nèi)容請(qǐng)點(diǎn)擊專題《Bootstrap Modal使用教程》進(jìn)行學(xué)習(xí)，希望大家喜歡。

如果大家還想深入學(xué)習(xí)bootstrap，可以點(diǎn)擊這里進(jìn)行學(xué)習(xí)，再為大家附3個(gè)精彩的專題：

Bootstrap學(xué)習(xí)教程

Bootstrap實(shí)戰(zhàn)教程

Bootstrap Table使用教程

Bootstrap插件使用教程

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

最新評(píng)論