javascript - 显示带有 ° 和 1 位小数的 jQuery slider 值

Question

1. 如何在 jQuery slider 中将值保留到小数点后 1 位？例如。 25-> 25.0

2. 如何在.val()中显示°C或°F，它只显示“°”而不是符号？

谢谢!!!

这是我的代码:

<script>
    function createSlider(unit,temp){
var x;

if (unit=="C"){
x= $("#slider").slider({
value: temp,
min: 5,
max: 35,
step:0.5,
slide: function( event, ui ) {$( "#amount" ).val( ui.value+"&degC");}} );

$( "#amount" ).val( $( "#slider" ).slider( "value" )+"&degC");
}
else{
x= $("#slider").slider({
// orientation: "vertical",
value: temp,
min: 41,
max: 95,
step:1,
slide: function( event, ui ) {$( "#amount" ).val( ui.value+"&degF");}} );

$( "#amount" ).val( $( "#slider" ).slider( "value" )+"&degF");

}
return x;
}
</script>
<input type="text" id="amount" readonly style="border:0;">
<div id="slider"></div>

Answer 1

首先我们从 slider /文本框中获取字符串值。

var str = $( "#amount" ).val();

要显示一位小数的数字，请将其转换为字符串并附加 .0。

//if number does not have a period
if(str.indexOf('.') === -1)
{
  //then append '.0', converting it to a string
  str += '.0';
}

如果我们想附加一个度数符号，我们需要使用一种有点 hack-y 的方法。我找到了这个here并对其进行了修改以使其(希望)更易于使用。

//create a div (as Evan noted, you should have a semicolon)
$('body').append("<div id='foo'>&deg;</div>");
//get div contents and delete div
var degree = $('#foo').text();
$('#foo').remove();
//replace the degree entity with the actual entity
str += '&deg;';
str.replace(/&deg;/g, degree);

然后我们将字符串放回文本框中。

$( "#amount" ).val(str);

这是你想要的吗？