防止內部點擊時下拉選單關閉
要防止Twitter Bootstrap 下拉選單在點擊內部元素時關閉,一種規避解決方案需要委託點擊事件處理。以下是詳細說明和建議的解決方案:
預設情況下,Twitter Bootstrap 下拉選單會在任何點擊後關閉,即使在選單本身內也是如此。為了克服這種行為,常見的方法是將點擊事件處理程序附加到下拉式選單並呼叫 event.stopPropagation() 以防止事件傳播。
但是,對於使用輪播控制等元件的設置,委託事件Twitter Bootstrap 的處理機制可能會幹擾預期的行為。在這種情況下,由於事件未到達委託的事件處理程序,請按一下這些控制項可能不會觸發預期的操作。
依賴下拉隱藏/隱藏事件不是一個可行的替代方案,因為這些事件缺乏必要的信息,並且控制下拉內容。
建議的解決方案
一個有效的解決方案是在容納下拉式選單的容器元素上使用事件委託。這是一個例子:
$(document).on('click', 'someyourContainer .dropdown-menu', function (e) {
e.stopPropagation();
});
在此範例中,按一下指定容器內的元素仍會將事件傳播到各自的委託處理程序。但是,專門針對下拉式選單的點擊將被攔截,並且 event.stopPropagation() 將阻止下拉式選單的關閉行為。
免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。
Copyright© 2022 湘ICP备2022001581号-3