jQuery UI滑塊 - 需要記住瀏覽器上的值「返回」

我在高級搜索窗體中使用jQuery UI滑塊（使用範圍滑塊精確）。我用它來按時間過濾視頻（以分鐘爲單位）。jQuery UI滑塊 - 需要記住瀏覽器上的值「返回」

到目前爲止，它工作得很好。

的默認值是5至55

現在我想要做的是：當我將其更改爲20-30，提交表單，看到的結果。當我在瀏覽器上點擊「返回」時，我希望該值爲20-30，而不是默認值。所以，我基本上希望滑塊記住我回去時選擇的值。

首先，是否可以這樣做？如果是這樣，我會需要幫助，因爲我不知道如何！

這裏的工作小提琴看到我的滑塊在行動：http://jsfiddle.net/nbjgH/

這是我的HTML表單：

<form id="advancedSearch" name="advancedSearch" class="search" action="/advancedsearchrun/"> 
    <input type="text" name="query" autofocus="autofocus" value="{{ query|default('') }}" > 

    <div class="slider-time"> 
     <label for="timeRange">Filter by duration:</label> 
     <input type="text" id="timeRange" /> 
     <input type="hidden" id="min_minutes" name="min_minutes" value="0" /> 
     <input type="hidden" id="max_minutes" name="max_minutes" value="5" /> 
    </div> 

     <input class="not_rounded_right float-left" type="submit" value="Search"> 
</form>

來源

2012-06-14 Lelly

向後發送參數是不可能的。如果添加自己的「後退」按鈕，您可以將變量保存到會話中。然後在後面的頁面上查看是否填充了這些變量。爲什麼不直接提交或發佈到新頁面呢？ –

您可以使用jQuery cookie以非常乾淨的方式實現此目的。

負荷的cookie，或者設置默認值如果爲null：

if ($.cookie('min')==null){ 
    $.cookie('min',5); 
} 
if ($.cookie('max')==null){ 
    $.cookie('max',55); 
}

通

values: [ $.cookie('min'), $.cookie('max')]

你的滑蓋構造

火

$("#min_minutes").val( ui.values[ 0 ]); 
$("#max_minutes").val( ui.values[ 1 ]);

幻燈片

DEMO
如果您訪問演示，改變滑塊，然後再訪問，或刷新......這將保存值。

來源

2012-06-14 16:22:17 skafandri

+1簡單，乾淨 – colonelclick

沒有指定所需的解決方案的範圍，但我會用PHP來解決像這樣的東西。當您提交表單時，您可以將變量保存到$ _SESSION中，然後在頁面上使用滑塊檢查這些變量是否可用，如果有，您可以將它們傳遞給初始化滑塊的JavaScript 。

來源

2012-06-14 16:01:22 colonelclick

您可以使用cookie，localStorage或sessionStorage來保存上次提交的範圍。您嘗試先讀取存儲的值：

var getLastRange = function(){ 
    // return data from cookie/local or session storage 
}; 

$("#slider-range").slider({ 
    range: true, 
    min: 0, 
    max: 60, 
    values: getLastRange() || [ 5, 55 ], 
    ... 
});

來源

2012-06-14 16:12:38 Mottie

jQuery UI滑塊 - 需要記住瀏覽器上的值「返回」

回答

相關問題