Jquery UI滑块值计算为div

时间:2014-11-17 13:05:24

标签: jquery jquery-ui slider

我需要让我的jquery UI计算器从两个不同的滑块计算,它应该按年龄划分贷款,当年龄超过40时,它应该增加10%的折扣,当它超过50时,它应该增加20%的折扣。目前它显示初始值,但是当我移动一个滑块时,初始值消失,当我改变两个滑块时,它再次出现,我需要这样做,当任何滑块改变时,它也会改变值,并且将其逗号再用逗号后的2位数

 function slider_age() {

   var initialValue = 25;
    var sliderTooltip = function(event, ui) {
    var curValue = ui.value || initialValue;
    $('#slider-range-min .ui-slider-handle')
    var tooltip = '<div class="tooltip"><div class="tooltip-inner" style="margin-left:12px;">' + curValue + '</div><div class="tooltip-arrow" style="margin-left:2px;"  ></div></div>';


 $('#slider-range-min .ui-slider-handle').html(tooltip);

}




    $( "#slider-range-min" ).slider({
      range: "min",
      value: initialValue,
      step: 1,
      min: 18,
      max: 65,
      create: sliderTooltip,
      slide:  sliderTooltip,
       change: function(event, ui) {
      slider_age = ui.value; 
      changeValue(); 
     }




    });

};


function slider_sum() {
       var initialValue = 400000;

var sliderTooltip = function(event, ui) {


    var curValue2 = ui.value || initialValue;
    var tooltip = '<div class="tooltip"><div class="tooltip-inner">' + curValue2 + '</div><div class="tooltip-arrow"></div></div>';

   $('#slider-range-loan .ui-slider-handle').html(tooltip);
    return curValue2;
}
   $( "#slider-range-loan" ).slider({

    range: "min",   
    value: initialValue,
    min: 20000,
    max: 1000000,
    step: 1000,
    create: sliderTooltip,
    slide: sliderTooltip,

    change: function(event, ui) {
     slider_sum = ui.value;

     changeValue();
     }
    });
    var sum =  $( "#slider-range-loan" ).slider( "value" );
    var age=  $( "#slider-range-min" ).slider( "value" ) ;
    $( ".sum" ).html(sum/age);

  };

目前的例子:

http://jsfiddle.net/c8mnjn98/

1 个答案:

答案 0 :(得分:0)

在函数中初始化变量slider_sum,slider_age,例如

function slider_age() {
    var initialValue = 25;
    ... 
    slider_age = initialValue;
    ... 
};


function slider_sum() {
    var initialValue = 400000;
    ... 
    slider_sum = initialValue;
    ....
}; 

DEMO-1:http://jsfiddle.net/c8mnjn98/2/

DEMO-2:http://jsfiddle.net/c8mnjn98/3/ - 我已将变量名称从slider_age,slider_sum更改为sliderAge,sliderSun,以避免与函数名称混淆