如何讓jQuery UI滑塊捕捉到預定義的值？

我有一個滑塊在jQuery UI中，我有一些預定義的值，用戶可以選擇。但是，現在，它只是從1-60開始，而不是使用我的價值觀。我有以下數字： 1,3,5,15,30,60如何讓jQuery UI滑塊捕捉到預定義的值？

這是我的代碼：

$(document).ready(function(){ 
    var valMap = [1,3,5,15,30,60]; 
    $("#resolution-slider").slider({ 
     min: 1, 
     max: 60, 
     values: [2], 
     slide: function(event, ui) {       
      $("#resolution").val(ui.values[0]);     
      $(".resolution-preview").html(ui.values[0]);     
     }  
    }); 
});

我怎樣才能使滑塊捕捉到我的valMap值？

來源

2012-05-02 Elias

沒有內置的功能來做到這一點，但是你可以重寫「幻燈片」事件捕捉到您的值。請參閱此問題中接受的anser：http://stackoverflow.com/questions/681303/is-there-a-plugin-or-example-of-a-jquery-slider-working-with-non-equably-divisib –

爲什麼不這樣做：

$(document).ready(function(){ 
    var valMap = [1,3,5,15,30,60]; 
    $("#resolution-slider").slider({ 
     max: valMap.length - 1, // Set "max" attribute to array length 
     min: 0, 
     values: [2], 
     slide: function(event, ui) { 
     $("#resolution").val(valMap[ui.values[0]]); // Fetch selected value from array    
     $(".resolution-preview").html(valMap[ui.values[0]]); 
     } 
    }); 
});

來源

2012-05-02 10:11:19 Jan

這就像一個魅力！德！ :) – Elias

我認爲這是你想要的，試試看下面的代碼：

<div id="slide"></div> 

var valMap = [1,3,5,15,30,60]; 

$("#slide").slider({ 
    max: 60, 
    min: 1, 
    stop: function(event, ui) { 
    console.log(ui.value); 
    }, 
    slide: function(event, ui) { 
    // 1,3,5,15,30,60 
    return $.inArray(ui.value, valMap) != -1; 
    } 
});

來源

2012-05-02 09:49:42 ijse

如何讓jQuery UI滑塊捕捉到預定義的值？

回答

相關問題