如何在jquery ui價格範圍滑塊中動態更改數值

-2

我正在使用jquery ui價格範圍滑塊。我可以選擇貨幣。問題是如果用戶選擇不同的貨幣，範圍滑塊仍然是相同的。我想在更改貨幣時更改不同貨幣的滑塊範圍值。現在它只是顯示在美元的範圍內，我想，當用戶將選擇歐元，範圍將改爲歐元這是我在做什麼如何在jquery ui價格範圍滑塊中動態更改數值

<title>jQuery UI Slider - Range slider</title> 
    <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> 
    <script src="//code.jquery.com/jquery-1.9.1.js"></script> 
    <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script> 
    <link rel="stylesheet" href="/resources/demos/style.css"> 
    <script> 
    $(function() { 
    $("#slider-range").slider({ 
     range: true, 
     min: 0, 
     max: 500, 
     values: [ 75, 300 ], 
     slide: function(event, ui) { 
     $("#amount").val("$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ]); 
     } 
    }); 
    $("#amount").val("$" + $("#slider-range").slider("values", 0) + 
     " - $" + $("#slider-range").slider("values", 1)); 
    }); 
    </script> 
</head> 
<body> 
<select name=currency class=f15> 
        <option value=USD selected>USD</option> 
        <option value=BDT >BDT</option> 
        </select> &nbsp; 
<p> 
    <label for="amount">Price range:</label> 
    <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;"> 
</p> 

<div id="slider-range"></div>

Fiddle

來源

2014-02-06 Mitthun

...對不起@zzlalani ...這沒有意義，並沒有適當的格式發佈。感謝編輯。 –

歡迎您使它成爲'PROPER' – zzlalani

試試這個，

Demo

$(function() { 
    $('select').change(function(){ 
    $("#amount").val($('select').val() + $("#slider-range").slider("values", 0) + 
     " - "+ $('select').val() + $("#slider-range").slider("values", 1)); 
    }) 
    $("#slider-range").slider({ 
     range: true, 
     min: 0, 
     max: 500, 
     values: [ 75, 300 ], 
     slide: function(event, ui) { 
     $("#amount").val($('select').val() + ui.values[ 0 ] + " - "+ $('select').val() + ui.values[ 1 ]); 
     } 
    }); 
    $("#amount").val($('select').val() + $("#slider-range").slider("values", 0) + 
     " - "+ $('select').val() + $("#slider-range").slider("values", 1)); 
    });

HTML：

<select name=currency class=f15> 
        <option value="$" selected>USD</option> 
        <option value="&#2547;" >BDT</option> 
        </select> &nbsp; 
<p> 
    <label for="amount">Price range:</label> 
    <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold;"> 
</p> 

<div id="slider-range"></div>

來源

2014-02-06 06:07:29 dhana

非常感謝，它的工作原理 – Mitthun

如何在jquery ui價格範圍滑塊中動態更改數值

回答

相關問題