如何在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价格范围滑块中动态更改数值

回答

相关问题