jQuery滑块计算器

时间:2011-09-24 19:53:34

标签: jquery sliders

您好我想创建一些滑块,我需要做的是制作一个有3个选项的滑块:

  1. 用户想借的金额(从12,500到100,000) - 将显示选择器所在的值
  2. 多长时间(从5年到25年) - 将显示选择器所在的值

  3. 根据每月还款的价值估算。

  4. 我在这里看过别人,但不太明白他们的逻辑工作方式,所以如果有人能提供帮助就会很棒。

    我添加了一个快速移动图片:http://dl.dropbox.com/u/12506430/sliders.jpg

1 个答案:

答案 0 :(得分:0)

Demo here

<h2>How much would you like to borrow?</h2>
<div id="amount"></div>

<h2>Over how long?</h2>
<div id="period"></div>

<h2>Result</h2>
Your monthly payment will be $<span id="monthly">204.86</span>


function update() {
    var amount = $('#amount').slider('value');
    var period = $('#period').slider('value');
    var monthly = (amount + amount * 0.03 * period) / (period * 12);
    $("#monthly").text(monthly.toFixed(2));

}

$("#amount").slider({
    value: 12500,
    min: 12500,
    max: 100000,
    step: 50,
    slide: function() {
        update();
    }
});

$("#period").slider({
    value: 5,
    min: 5,
    max: 25,
    step: 1,
    slide: function() {
        update();
    }
});