從twitter發佈重點Bootstrap Modal

我在Twitter Bootstrap中有一個NavBar，帶有打開Modals的鏈接。下面我有一個畫布，拖動不同的項目。從twitter發佈重點Bootstrap Modal

我遇到的問題是，在一些移動設備上，每當我打開NavBar，然後從其中一個鏈接打開一個Modal，然後點擊模式的內容，然後關閉它，所有焦點都會得到轉移到該模式，拖動到Navbar下方變得非常慢。重置它的方式我發現是在導航欄上做一個簡單的點擊，然後全部恢復正常。但顯然我需要通過編程方式找到一種方式來釋放焦點，而不必讓用戶點擊導航欄。

如果您只是打開並關閉導航欄中的下拉列表，或者如果打開模式並在不點擊其內部的情況下將其關閉，則問題不會發生。對於發生的問題，必須單擊模態內容。我想這就是焦點到模態的原因。然後問題就會發生。我關閉了模式並關閉了下拉菜單，但仍然有點焦點停留在那裏，因爲應用程序的其他部分遇到麻煩，直到我點擊Navbar，似乎釋放焦點並且再次正常工作。

那麼，如何確保我完全發佈了我一直在操作的任何模態/下拉菜單。你可以想像我一直在嘗試各種與模糊等的組合，包括：

document.activeElement.blur(); 
    $("input").blur(); 
    $(".navbar-toggle").blur();    
    $(".navbar").blur();  
    $(".navbar-default").blur();  
    $(".collapse").blur(); 
    $("#myModalHow").blur(); 
    $(".modal-dialog").blur(); 
    $(".modal-content").blur(); 
    $(".modal-header").blur(); 
    $(".modal-title").blur(); 
    $(".modal").blur(); 
    $(".close").blur();

等等等等

也嘗試設置與其它元素

$("#anotherelement").focus(); 
    $("#anotherelement").blur();

也試圖在移除焦點以編程方式模擬在導航欄上的點擊

$("#bs-example-navbar-collapse-1").trigger("click");

到目前爲止沒有運氣。

來源

2014-01-13 Javier Gonzalez

我只是發現了下面，如果我從模式聲明刪除褪色，因此使用類=「莫代爾」，而不是「模式變臉」，那麼這行代碼解決了問題 $（「。modal」）。（'hidden.bs.modal'，function（）{ document.activeElement.blur（）; 但是，如果我使用FADE淡出模態，它失敗了，我如何確保相同的解決方案與FADE一起使用？謝謝 –

我覺得在Bootstrap中存在一個問題，因爲它在動畫結束之前觸發了hidden.bs.popover事件。你可以嘗試使用setTimeout()來解決此問題：

$(".modal").on('hidden.bs.modal', function() { 
    setTimeout(function() { 
     document.activeElement.blur(); 
    }, 150); 
});

來源

2014-01-14 11:11:53

從twitter發佈重點Bootstrap Modal

回答

相關問題