jQuery UI滑塊 - 在函數中使用默認值

Question

我需要一些關於jQuery UI滑塊的幫助，我已經設置了初始值，但似乎無法找到加載頁面時顯示它的方法。我還需要能夠將兩個滑塊值調用到一個函數中進行計算，然後將其顯示到屏幕上。

您可以在這裏查看我的小提琴測試>http://jsfiddle.net/cC3Qh/

jQuery的

$(function() { 
    $("#slider1").slider({ 
     max: 2500, 
     value: 1000, 
     slide: function(event, ui) { $("#slider-result1").html(ui.value); }, 
     change: function(event, ui) { calPrice(ui.value); } 
    }); 

    $("#slider2").slider({ 
     max: 30, 
     value: 12, 
     slide: function(event, ui) { $("#slider-result2").html(ui.value); }, 
     change: function(event, ui) { calDays(ui.value); } 
    }); 
    }); 

    function calDays(sliderval){ 
    var day = sliderval; 
    day = day * 100; 
    document.getElementById('price2').innerHTML = day; 
    var price = document.getElementById('price1').innerHTML; 
    price = price * day; 
    document.getElementById('price3').innerHTML = price; 
    } 

    function calPrice(sliderval){ 
    var price = sliderval; 
    price = price * 100; 
    document.getElementById('price1').innerHTML = price; 
    } 

感謝。

Answer 1

添加create事件處理滑塊：

$("#slider1").slider({ 
    max: 2500, 
    value: 1000, 
    slide: function (event, ui) { 
     $("#slider-result1").html(ui.value); 
    }, 
    change: function (event, ui) { 
     calPrice(ui.value); 
    }, 
    create: function (event, ui) { 
     $("#slider-result1").html($(this).slider("value")); 
    } 
}); 

Answer 2

添加到您準備功能：

// display slider value on load 
$("#slider-result1").html($("#slider1").slider("value")); 
$("#slider-result2").html($("#slider2").slider("value")); 

// perform calculations on load 
calPrice($("#slider1").slider("value")); 
calDays($("#slider2").slider("value")); 

http://jsfiddle.net/samliew/cC3Qh/1/