JQueryUI滑块不能在IE上工作

Question

我一直在尝试让滑块在控件旁边显示其当前值。本教程http://www.ryancoughlin.com/demos/interactive-slider/解释了如何轻松和无痛。

现在我试图设置3个连续的滑块并且工作正常，但IE为所有三个控件设置了默认值（0到100，步骤1，动画假...）的选项。尽管在FF和Chrome中运行良好。

我错过了什么？谢谢。

继承人的代码：

 $('#slider-alpha').slider({ 
      range : false, 
      value : 5, 
      step: 1, 
      animate: "true", 
      min: 1, 
      max : 10, 


     }); 

    $('#slider-gamma').slider({ 
      range : false, 
      value : 50, 
      step: 10, 
      animate: "true", 
      min: 1, 
      max : 200, 

     }); 

    $('#slider-beta').slider({ 
      range : false, 
      values : 50, 
      step: 10, 
      animate: "true", 
      min: 1, 
      max : 300, 

     }); 




<script> 
$(function() { 

//alpha 
var slide_int_alpha = null; 
var slide_int_beta = null; 
var slide_int_gamma = null; 

function update_slider_alpha(){ 
    var value = $('#slider-alpha').slider('option', 'value'); 
     $('#alpha-value').text('No. of alpha: '+value); 
     $('#alpha-value').fadeIn(); 
} 

function update_slider_beta(){ 
    var valuet = $('#slider-beta').slider('option', 'value'); 
     $('#beta-value').text('No. of beta: '+valuet); 
     $('#beta-value').fadeIn(); 
} 

function update_slider_gamma(){ 
    var valuep = $('#slider-gamma').slider('option', 'value'); 
     $('#gamma-value').text('No. of gamma: '+valuep); 
     $('#gamma-value').fadeIn(); 
} 

$("#slider-alpha").slider({ 
    start: function(event, ui){ 
    $('#alpha-value').empty(); 
     slide_int_alpha = setInterval(update_slider_alpha, 10); 
    }, 
    slide: function(event, ui) 
    { 
     setTimeout(update_slider_alpha, 10); 
    }, 
    stop: function(event, ui){ 
     clearInterval(slide_int_alpha); 
     slide_int_alpha = null; 
    } 
}); 

$("#slider-beta").slider({ 
    start: function(event, ui){ 
     $('#beta-value').empty(); 
      slide_int_beta = setInterval(update_slider_beta, 10); 
     }, 
    slide: function(event, ui) 
     { 
      setTimeout(update_slider_beta, 10); 
     }, 
    stop: function(event, ui){ 
     clearInterval(slide_int_beta); 
     slide_int_beta = null; 
    } 
}); 

$("#slider-gamma").slider({ 
    start: function(event, ui){ 
     $('#gamma-value').empty(); 
      slide_int_gamma = setInterval(update_slider_gamma, 10); 
     }, 
    slide: function(event, ui) 
     { 
      setTimeout(update_slider_gamma, 10); 
     }, 
    stop: function(event, ui){ 
     clearInterval(slide_int_gamma); 
     slide_int_gamma = null; 
    } 
}); 


}); 

</script> 





    <div id="alpha-value">No. of alpha: 5</div> 
    <div id="slider-alpha" style="width: 90%;text-align: center;"></div> 
    <br /> 

    <div id="beta-value">No. of beta: 20</div> 
    <div id="slider-beta" style="width: 90%;text-align: center;"></div> 
    <br /> 

    <div id="gamma-value">No. of gamma: 20</div> 
    <div id="slider-gamma" style="width: 90%;text-align: center;"></div> 
    <br />  

Answer 1

而Firefox和Chrome妥善处理它们，Internet Explorer不喜欢的对象，参数列表trailing commas等

$('#slider-alpha').slider({ 
     range : false, 
     value : 5, 
     step: 1, 
     animate: "true", 
     min: 1, 
     max : 10 
    }); 

$('#slider-gamma').slider({ 
     range : false, 
     value : 50, 
     step: 10, 
     animate: "true", 
     min: 1, 
     max : 200 
    }); 

$('#slider-beta').slider({ 
     range : false, 
     values : 50, 
     step: 10, 
     animate: "true", 
     min: 1, 
     max : 300 
    });