javascript – jQuery UI Slider – 在函数中使用默认值

我需要一些关于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;
  }

谢谢.

解决方法:

向滑块添加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"));
    }
});

标签：uislider,javascript,jquery
来源： https://codeday.me/bug/20190825/1723736.html