jQuery移動面板不應該關閉滑動左

我有一個簡單的jQuery移動頁面，有一個側邊欄面板，一旦單擊head元素中的按鈕，就會在左側打開。這工作正常。問題是我在側邊欄面板中有一個包含範圍滑塊的窗體，並且當您將rangeslider移動到左側時，面板關閉。任何想法如何防止這一點。jQuery移動面板不應該關閉滑動左

我曾嘗試：data-swipe-close="false"（發現here）

，只是要還安全：data-dismissible="false"從上面相同的鏈接。

我的HTML如下。側邊欄面板的內容在頁面加載時生成並正確顯示，並且表單提交正確：

 <div data-role="page" data-type="page" id="select">   
     <div data-role="panel" data-theme="g" id="sidebar" data-display="overlay" data-position-fixed="true" data-swipe-close="false" data-dismissible="false"> 
      <div id='sidebarview' data-theme='g' data-role="collapsible-set" data-inset="false" data-mini="false"></div> 
     </div> 
     <div id="header" data-theme="h" data-role="header" data-position="fixed"> 
      <h3>MOBILE</h3> 
      <a id='sidebarbutton' data-role="button" data-theme="h" href="#sidebar" class="ui-btn-left" data-icon="bars" data-iconpos="notext"></a> 
      <a id='gpsButton' data-role="button" data-theme="h" href="javascript:void(0);" class="ui-btn-right">GPS</a> 
     </div> 
     <div id="content-dataview" data-role="content"> 
     </div> 
     <div data-role="footer" data-id="footer" data-position="fixed" data-theme="h"> 
      <div data-role="navbar" data-theme="h"> 
       <ul> 
        <li><a onclick='user.logout();' href='javascript:void(0)'>Logout</a></li> 
       </ul> 
      </div> 
     </div> 
    </div>

任何想法？

來源

2013-05-16 Marc Steven Plotz

您還應該添加一個rangeslider到面板上。不要指望其他人會這樣做。 – Gajotres

在頁面加載時，會將rangeslider動態添加到面板。我確實說過這一切都很完美。 –

@MarcStevenPlotz - 也許他們實際上想看到一些代碼，但沒有認識到jQuery mobile如何從標記中運行。 –

我有同樣的問題，發現了（弱）解決方法：

，如果你點擊並按住滑塊（或在觸摸屏上長按），然後才移動滑塊，然後面板沒有按」關閉。

但當然我寧願有一個適當的解決方案。看起來滑塊移動觸發了「滑動」事件，這又導致面板關閉。

但是，那麼data-swipe-close="false"應該解決這個問題。

來源

2014-04-11 08:38:32 matthiku

你的問題沒有說明你正在使用哪個版本的jquery和jquerymobile。下面是我刪除了摹主題，其中有一個透明的背景，這使得覆蓋看起來很奇怪的這個使用jQuery 1.8.2和1.4.2 jquerymobile

正常工作的例子。

我還添加了一系列輸入滑塊和關閉按鈕在的jsfiddle例如面板：

http://jsfiddle.net/hQguV/

<div data-role="page" data-type="page" id="select">   
     <div data-role="panel" id="sidebar" data-display="overlay" data-position-fixed="true" data-swipe-close="false" data-dismissible="false"> 
      <div id='sidebarview' data-theme='g' data-role="collapsible-set" data-inset="false" data-mini="false">This is content in #sidebarview</div> 
      <input type="range" min="0" max="42" value="42" id="testslider"/> 
      <a href="#" data-rel="close" class="ui-btn">Close panel</a> 
     </div> 
     <div id="header" data-theme="h" data-role="header" data-position="fixed"> 
      <h3>MOBILE</h3> 
      <a id='sidebarbutton' data-role="button" data-theme="h" href="#sidebar" class="ui-btn-left" data-icon="bars" data-iconpos="notext"></a> 
      <a id='gpsButton' data-role="button" data-theme="h" href="javascript:void(0);" class="ui-btn-right">GPS</a> 
     </div> 
     <div id="content-dataview" data-role="content"> 
     </div> 
     <div data-role="footer" data-id="footer" data-position="fixed" data-theme="h"> 
      <div data-role="navbar" data-theme="h"> 
       <ul> 
        <li><a onclick='user.logout();' href='javascript:void(0)'>Logout</a></li> 
       </ul> 
      </div> 
     </div> 
    </div>

來源

2014-06-18 18:08:09 SecondJon

jQuery移動面板不應該關閉滑動左

回答

相關問題