2015-12-19 2 views
0

У меня возникла проблема с приведенным ниже кодом. Он работает здесь и на скрипке, но на моей странице, когда я меняю выбор на 4,6,8, я получаю перемещение ползунка, но когда я выбираю 4.5.5.5.7.5, я получаю: Ошибка при отсутствии: ошибка синтаксиса, нераспознанное выражение: опция [значение = 1,5]. Как я могу это исправить?JQuery ui slider step 0.5

$(".needSlider").each(function() { 
 
    var select = $(this); 
 
    var slider = $("#slider").slider({ 
 
     min: 1, 
 
     max: 199, 
 
     range: "min", 
 
     value: select[0].selectedIndex + 1, 
 
     slide: function(event, ui) { 
 
     select[0].selectedIndex = ui.value - 1; 
 
     } 
 
    }); 
 
    select.change(function() { 
 
     slider.slider("value", this.selectedIndex + 1); 
 
    }); 
 
}); 
 

 
$(".needSlider1").each(function() { 
 
     var select = $(this); 
 
     var slider = $("#slider1").slider({ 
 
     value: select.val(), 
 
     min: 1, 
 
     max: 99, 
 
     step: 1, 
 
     range: "min", 
 
     slide: function(event, ui) { 
 
     select[0].selectedIndex = ui.value - 1; 
 
     } 
 
    }); 
 
    select.change(function() { 
 
     slider.slider('value', this.selectedIndex + 1); 
 
    }); 
 
}); 
 

 
$(".needSlider2").each(function() { 
 
    var select = $(this); 
 
    var slider = $("#slider2").slider({ 
 
     min: 1, 
 
     max: 99, 
 
     range: "min", 
 
     value: select[0].selectedIndex + 1, 
 
     slide: function(event, ui) { 
 
     select[0].selectedIndex = ui.value - 1; 
 
     } 
 
    }); 
 
    select.change(function() { 
 
     slider.slider("value", this.selectedIndex + 1); 
 
    }); 
 
}); 
 

 
$(".needSlider3").each(function() { 
 
    var select = $(this); 
 
    var slider = $("#slider3").slider({ 
 
     min: 1, 
 
     max: 99, 
 
     range: "min", 
 
     value: select[0].selectedIndex + 1, 
 
     slide: function(event, ui) { 
 
     select[0].selectedIndex = ui.value - 1; 
 
     } 
 
    }); 
 
    select.change(function() { 
 
     slider.slider("value", this.selectedIndex + 1); 
 
    }); 
 
});
<link rel="stylesheet" href="https://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
 
<script src="https://code.jquery.com/jquery-2.1.4.js"></script> 
 
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
 
<select class="needSlider1" id="minbeds1" name="fun" class="form-text" style="padding-right:0;" > 
 
<option value="1">1</option> 
 
           <option value="1.5">1.5</option> 
 
            
 
           <option value="2">2</option> 
 
            
 
           <option value="2.5">2.5</option> 
 
            
 
           <option value="3">3</option> 
 
            
 
           <option value="3.5">3.5</option> 
 
            
 
           <option value="4">4</option> 
 
            
 
           <option value="4.5">4.5</option> 
 
            
 
           <option value="5">5</option> 
 
            
 
           <option value="5.5">5.5</option> 
 
            
 
           <option value="6">6</option> 
 
            
 
           <option value="6.5">6.5</option> 
 
            
 
           <option value="7">7</option> 
 
            
 
           <option value="7.5">7.5</option> 
 
            
 
           <option value="8">8</option> 
 
            
 
           <option value="8.5">8.5</option> 
 
            
 
           <option value="9">9</option> 
 
            
 
           <option value="9.5">9.5</option> 
 
            
 
           <option value="10">10</option> 
 
            
 
           <option value="10.5">10.5</option> 
 
            
 
           <option value="11">11</option> 
 
            
 
           <option value="11.5">11.5</option> 
 
            
 
           <option value="12">12</option> 
 
            
 
           <option value="12.5">12.5</option> 
 
            
 
           <option value="13">13</option> 
 
            
 
           <option value="13.5">13.5</option> 
 
            
 
           <option value="14">14</option> 
 
            
 
           <option value="14.5">14.5</option> 
 
            
 
           <option value="15">15</option> 
 
            
 
           <option value="15.5">15.5</option> 
 
            
 
           <option value="16">16</option> 
 
            
 
           <option value="16.5">16.5</option> 
 
            
 
           <option value="17">17</option> 
 
            
 
           <option value="17.5">17.5</option> 
 
            
 
           <option value="18">18</option> 
 
            
 
           <option value="18.5">18.5</option> 
 
            
 
           <option value="19">19</option> 
 
            
 
           <option value="19.5">19.5</option> 
 
            
 
           <option value="20">20</option> 
 
            
 
           <option value="20.5">20.5</option> 
 
            
 
           <option value="21">21</option> 
 
            
 
           <option value="21.5">21.5</option> 
 
            
 
           <option value="22">22</option> 
 
            
 
           <option value="22.5">22.5</option> 
 
            
 
           <option value="23">23</option> 
 
            
 
           <option value="23.5">23.5</option> 
 
            
 
           <option value="24">24</option> 
 
            
 
           <option value="24.5">24.5</option> 
 
            
 
           <option value="25">25</option> 
 
            
 
           <option value="25.5">25.5</option> 
 
            
 
           <option value="26">26</option> 
 
            
 
           <option value="26.5">26.5</option> 
 
            
 
           <option value="27">27</option> 
 
            
 
           <option value="27.5">27.5</option> 
 
            
 
           <option value="28">28</option> 
 
            
 
           <option value="28.5">28.5</option> 
 
            
 
           <option value="29">29</option> 
 
            
 
           <option value="29.5">29.5</option> 
 
            
 
           <option value="30">30</option> 
 
            
 
           <option value="30.5">30.5</option> 
 
            
 
           <option value="31">31</option> 
 
            
 
           <option value="31.5">31.5</option> 
 
            
 
           <option value="32">32</option> 
 
            
 
           <option value="32.5">32.5</option> 
 
            
 
           <option value="33">33</option> 
 
            
 
           <option value="33.5">33.5</option> 
 
            
 
           <option value="34">34</option> 
 
            
 
           <option value="34.5">34.5</option> 
 
            
 
          
 
               
 
</select> 
 
<div id="slider1"></div> 
 

 
<select class="needSlider" id="minbeds" name="przebieg" class="form-text" style="padding-right:0;"> <option value="5000">5000</option> 
 
            
 
           <option value="10000">10000</option> 
 
            
 
           <option value="15000">15000</option> 
 
            
 
           <option value="20000">20000</option> 
 
            
 
           <option value="25000">25000</option> 
 
            
 
           <option value="30000">30000</option> 
 
            
 
           <option value="35000">35000</option> 
 
            
 
           <option value="40000">40000</option> 
 
            
 
           <option value="45000">45000</option> 
 
            
 
           <option value="50000">50000</option> 
 
            
 
           <option value="55000">55000</option> 
 
            
 
           <option value="60000">60000</option> 
 
            
 
           <option value="65000">65000</option> 
 
            
 
           <option value="70000">70000</option> 
 
            
 
           <option value="75000">75000</option> 
 
            
 
           <option value="80000">80000</option> 
 
            
 
           <option value="85000">85000</option> 
 
            
 
           <option value="90000">90000</option> 
 
            
 
           <option value="95000">95000</option> 
 
            
 
           <option value="100000">100000</option> 
 
            
 
           <option value="105000">105000</option> 
 
            
 
           <option value="110000">110000</option> 
 
            
 
           <option value="115000">115000</option> 
 
            
 
           <option value="120000">120000</option> 
 
            
 
           <option value="125000">125000</option> 
 
            
 
           <option value="130000">130000</option> 
 
            
 
           <option value="135000">135000</option> 
 
            
 
           <option value="140000">140000</option> 
 
            
 
           <option value="145000">145000</option> 
 
            
 
           <option value="150000">150000</option> 
 
            
 
           <option value="155000">155000</option> 
 
            
 
           <option value="160000">160000</option> 
 
            
 
           <option value="165000">165000</option> 
 
            
 
           <option value="170000">170000</option> 
 
            
 
           <option value="175000">175000</option> 
 
            
 
           <option value="180000">180000</option> 
 
            
 
           <option value="185000">185000</option> 
 

 
    </select> 
 
    <div id="slider"></div>

+0

Вы должны добавить step = 0.5 paramtere в свой ползунок, а когда изменить его добавление и вычесть 0.5 – WisdmLabs

+0

, пожалуйста, не включайте теги в title.attach только. –

ответ

0
$("#slider-range-min").slider({ 
    range: "min", 
    step: 0.01, 
    value: 37.09, 
    min: 0.01, 
    max: 700.99, 
    slide: function(event, ui) { 
     $("#amount").val("$" + ui.value.toFixed(2)); 
    } 
}); 
$("#amount").val("$" + $("#slider-range-min").slider("value").toFixed(2)); 

Это ответ на ваш вопрос :) десятичную и если вы измените .toFixed (2) к .toFixed (3), он покажет 3 десятичные точки.

+0

Можете ли вы показать мне пример? потому что код ur не работал, когда я тестировал его :) –