无法使用编程加载的属性更新范围滑块.js

我正在尝试使用 rangeslider.js插件创建一个图形编辑器，但不知何故它无法正确更新条形图（大多数时候它根本不起作用）。我在这里有一个工作演示，但也为它创建了一个简化的小提琴。有时，当我在脚本中执行两次单击时会有所帮助（不是小提琴，也不知道为什么）。任何帮助非常感谢！

$(function() {
var $document   = $(document),
    $inputRange = $('input[type="range"]');
function valueOutput(element) {
    var value = element.value,
    output = element.parentNode.getElementsByTagName('output')[0];
    output.innerHTML = value;
}
for (var i = $inputRange.length - 1; i >= 0; i--) {
    valueOutput($inputRange[i]);
};
$document.on('input', 'input[type="range"]', function(e) {
    valueOutput(e.target);
});
$document.on('input', '#graph-kw input', function(e) {
    $stock_kw = $('#jform_stock_kw').val();
    $remap_kw = $('#jform_remap_kw').val();
    $stock_vals = $('#graph-kw output.stock-kw');
    $remap_vals = $('#graph-kw output.remapped-kw');
    $('#jform_graph_stock_kw').val($stock_vals.map(function() {
        value = $(this).val();
        if(value>0) return (value/$stock_kw).toFixed(3);
    }).get().join(','));
    $('#jform_graph_remap_kw').val($remap_vals.map(function() {
        value = $(this).val();
        if(value>0) return (value/$remap_kw).toFixed(3);
    }).get().join(','));
});
$document.on('input', '#graph-nm input', function(e) {
    $stock_nm = $('#jform_stock_nm').val();
    $remap_nm = $('#jform_remap_nm').val();
    $stock_vals = $('#graph-nm output.stock-nm');
    $remap_vals = $('#graph-nm output.remapped-nm');
    $('#jform_graph_stock_nm').val($stock_vals.map(function() {
        value = $(this).val();
        if(value>0) return (value/$stock_nm).toFixed(3);
    }).get().join(','));
    $('#jform_graph_remap_nm').val($remap_vals.map(function() {
        value = $(this).val();
        if(value>0) return (value/$remap_nm).toFixed(3);
    }).get().join(','));
});
$inputRange.rangeslider({
  polyfill: false
});

$('#jform_engine_type,#jform_engine_supercharged').on('change', function() {
    var $fuel = $('#jform_engine_type > input[type="radio"]:checked').val();
    var $turbo = $('#jform_engine_supercharged > input[type="radio"]:checked').val();
    if($turbo !== undefined && $fuel !== undefined) {
        if($turbo == "yes" && $fuel == "Diesel") $('#jform_visual_graph0').prop('checked',true);
        if($turbo == "no" && $fuel == "Diesel") $('#jform_visual_graph1').prop('checked',true);
        if($turbo == "yes" && $fuel == "Gasoline") $('#jform_visual_graph2').prop('checked',true);
        if($turbo == "no" && $fuel == "Gasoline") $('#jform_visual_graph3').prop('checked',true);
        $('#jform_visual_graph').change();
    }
});
$('#jform_visual_graph').on('change', function() {
    var $button = $(this).find(':checked');
    var $label = $('label[for='+$button.attr('id')+']').html();
    $('#jform_visual_load').attr('data-id',$button.val()).html('<span class="icon icon-refresh"></span> '+$label);
});
$('#jform_visual_graph').append('<button href="#" id="jform_visual_load"><span class="icon icon-refresh"></span></button>');
$('#jform_visual_load').on('click', function(e) {
    e.preventDefault();
    var $el = $(this);
    $el.prop('disabled',true);
    $stock_kw = $('#jform_stock_kw').val();
    $remap_kw = $('#jform_remap_kw').val();
    $stock_nm = $('#jform_stock_nm').val();
    $remap_nm = $('#jform_remap_nm').val();
    $.ajax({
        'global': false,
        'url': $el.data('id')+'_kw.json',
        'dataType': "json",
        'success': function (data) {
            json = data;
            for(i=0, len=json[0].length; i < len; i++) {
                stock_val = Math.round($stock_kw * json[0][i]);
                remap_val = Math.round($remap_kw * json[1][i]);
                $('#stock_kw_'+i+' > input').attr({value: stock_val, max: $remap_kw}).prop('disabled',false).siblings('output').val(stock_val);
                $('#remap_kw_'+i+' > input').attr({value: remap_val, max: $remap_kw}).prop('disabled',false).siblings('output').val(remap_val);
            }
            $('#graph-kw input').rangeslider('update', true);
        }
    });
    $.ajax({
        'global': false,
        'url': $el.data('id')+'_nm.json',
        'dataType': "json",
        'success': function (data) {
            json = data;
            for(i=0, len=json[0].length; i < len; ++i) {
                stock_val = Math.round($stock_nm * json[1][i]);
                remap_val = Math.round($remap_nm * json[0][i]);
                $('#stock_nm_'+i+' > input').attr({value: stock_val, max: $remap_nm}).prop('disabled',false).siblings('output').val(stock_val);
                $('#remap_nm_'+i+' > input').attr({value: remap_val, max: $remap_nm}).prop('disabled',false).siblings('output').val(remap_val);
            }
            $('#graph-nm input').rangeslider('update', true);
        }
    });
});
});