獲取使用twitter引導程序的雙範圍滑塊

我想使用此升級的jQuery Mobile雙範圍滑塊。
jQuery Mobile dual range slider working but buggy 獲取使用twitter引導程序的雙範圍滑塊

我需要使用它與twitter引導。但是，jQuery Mobile對Twitter引導程序不起作用，並且當javaScript文件放置在頁面底部時（按照yslow），它將殺死下拉菜單。這裏有3倍jsbin的例子來說明這個問題：

與jQuery Mobile的加入，Twitter的引導菜單失敗： http://jsbin.com/ibecox/1

沒有jQuery Mobile的.js文件中，Twitter的引導菜單正常工作： http://jsbin.com/ibecox/2

與所有的JavaScript中的標題（不好的做法）菜單也適用，但我需要避免把所有的JavaScript腳本： http://jsbin.com/ibecox/3

來源

2012-11-07 JStark

使用滑塊時遇到同樣的問題。 Twitter引導程序不適用於jQuery UI。 –

我可以看到有一個鏈接到twitter引導js，我已經修復它和你的示例對我來說工作正常，無論是下拉菜單和進度條

來源

2012-11-07 00:53:03

嗨Sergiy，感謝您注意到這一點。 jsFiddle與我的真實網頁產生了同樣的錯誤，所以我沒有注意到它們出於不同的原因。我已經更新了我的問題，以包含一個更接近我的真實頁面的jsBin，並正確說明了問題。 – JStark

如果你只是想讓jquerymobile的Range Slider工作使用Bootstrap，您可以使用Custom Download tool來下載（某種）使得範圍滑塊工作的片段。

你得到的是不完整的不幸，首先它不會自我初始化，所以你需要做手工：

$('div[data-role=rangeslider]').rangeslider();

你還需要應用一些風格的你自己彌補了在自定義下載中被遺漏的太多。但你會得到Range Sliders而不會破壞Bootstrap。

當你使用所有的jquery mobile時，Bootstrap break的原因更復雜。 Init模塊在整個代碼中應用了大量的類，特別是.ui-btn到按鈕。這是吹起Bootstrap的主要原因 - nav菜單使用按鈕標記，並且該標記可以應用有問題的類，然後從jquerymobile獲取所有問題樣式。

解決這個問題的方法很簡單，就是在不使用Init模塊的情況下使用jquerymobile，然後僅使用Init來滿足您的需求 - 希望它們的按鈕不是其中之一。解決這個問題的最好方法是非常激烈的：改進jquerymobile，以便與Bootstrap有任何衝突，或者某種特殊的noBSconflict（）方法或可以運行的某些方法，以避免應用會破壞Bootstrap的類，否則將正常進行。

來源

2015-12-11 20:24:41

獲取使用twitter引導程序的雙範圍滑塊

回答

相關問題