页面加载时的默认计算金额空白

我需要一个解决方案来显示我正在使用的滑动条计算出的默认数字。默认滑块值设置为“800”。计算出的金额应该显示为“99”。但是，直到用户移动滑块后，计算出的量才会显示出来 - 然后就没有问题了。我如何设置它，以便在页面加载时已经有默认的计算量“99”（基于“800”）？页面加载时的默认计算金额空白

非常感谢！

$(function() { 
 
$("#slider-range-max").slider({ 
 
    range: "100px", 
 
    min: 500, 
 
    max: 1500, 
 
    value: 800, 
 
    slide: function(event, ui) { 
 
    $("#amount").val(ui.value); //ui.value inside the event contains the slider value 
 
    var x=$("#amount").val(); //this way you access slider value anywhere in your code 
 
    var y=1.49; 
 
    var a= Math.round(x*y/12); 
 
    $("#product").html(a); 
 
    } 
 
}); 
 
    $("#amount").val($("#slider-range-max").slider("value")); 
 

 
}); 
 

 

 
</script> 
 

 

 
</head> 
 
<body> 
 

 
<p> 
 

 
<input type="text" id="amount" style="border:0 
 
; font-size: 40px; color:#f6931f; font-weight:bold;"> 
 

 
<label for="amount" style="border:0 
 
; font-size: 10px; color:#f6931f; font-weight:bold; ">/per month</label> 
 

 
</p> 
 
<div id="slider-range-max"></div> 
 
<br/> 
 

 

 
style="border:0; font-size: 40px; color:#f6931f; font-weight:bold;"> 
 

 
$<span id="product"></span> 
 
</p> 
 

 
</body> 
 
</html>

来源

2014-11-03 Drew

你可以从你的移动计算成一个函数，将您的默认值到一个变量，然后执行以下操作：

function calculateResult(value) { 
    return Math.round(value * 1.49/12); 
} 

$(function() { 
var defaultValue = 800; 
$("#product").html(calculateResult (defaultValue)); 
$("#slider-range-max").slider({ 
    range: "100px", 
    min: 500, 
    max: 1500, 
    value: defaultValue, 
    slide: function(event, ui) { 
    var productValue = calculateResult(ui.value); 
    $("#amount").val(ui.value); //ui.value inside the event contains the slider value 
    $("#product").html(productValue); 
    } 
}); 
    $("#amount").val($("#slider-range-max").slider("value")); 

});

来源

2014-11-03 03:25:27

这工作就像一个魅力！非常感谢！ – Drew 2014-11-03 03:29:22

页面加载时的默认计算金额空白

回答

相关问题