使用 JavaScript 对数字进行舍入

我在应用程序中实现了车辆VIN解码器API。当车辆的VIN输入输入框并选择提交时，它将返回该特定车辆的基本数据。有时，位移作为具有许多小数位的数字返回。我想编辑这个，把这个数字四舍五入到小数点后一位。

如果输入此 VIN：WAUUL78E38A092113返回以下数据：

制造商：奥迪年份： 2008
品牌：奥迪

型号： S4 车身类型：旅行车排量： 4.163000
气缸数： 8
马力： 344

位移应为：4.2，而显示为4.163000

如何创建将所有位移数字四舍五入到小数点后一位的命令？

这个问题与其他问题不同，因为我希望每个"#t6"值都四舍五入，而不仅仅是一个数字。如果为排量为 3.67 的车辆输入 VIN，则需要四舍五入为 3.7。如果为排量为 5.87 的车辆输入 VIN，则需要四舍五入为 5.9。等等...

因此，我的问题在于创建一个舍入所有位移的函数;因此，我需要帮助创建一个与"#t6"ID绑定的函数。

这是我的代码：

<!DOCTYPE html>
<html>
<head>
<title>VIN Decoder API Test</title>
<style type="text/css">
input {width: 200px;}
.border {border:1px solid black}
textarea {display: block;margin-left:auto;margin-right: auto;}
</style>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#submit_btn").click(function () {
var val = $("#b12").val();
$.ajax({
url: "https://vpic.nhtsa.dot.gov/api/vehicles/DecodeVINValuesBatch/",
type: "POST",
data: { format: "json", data: val},
dataType: "json",
success: function(result)
{
$("#t1").text(result.Results[0].Manufacturer);
$("#t2").text(result.Results[0].ModelYear);
$("#t3").text(result.Results[0].Make);
$("#t4").text(result.Results[0].Model);
$("#t5").text(result.Results[0].BodyClass);
$("#t6").text(result.Results[0].DisplacementL);
$("#t7").text(result.Results[0].EngineCylinders);
$("#t8").text(result.Results[0].EngineHP);
const input1 = (result.Results[0].ModelYear);
const input2 = (titleCase(result.Results[0].Make));
const input3 = (result.Results[0].Model);
const input5 = (result.Results[0].EngineCylinders);
const input6 = (result.Results[0].EngineHP);
const input7 = (result.Results[0].DisplacementL);
document.getElementById("t2a").value =
"Up for sale is a "+input1+" "+input2+" "+input3+". The "+input3+" produces "+input6+" horsepower from a "+input7+" liter "+input5+" cylinder engine."
},
error: function(xhr, ajaxOptions, thrownError)
{
console.log(xhr.status);
console.log(thrownError);
}
});
})
});
function titleCase(str, spliters = [' ']) {
str = (str || '').toString().toLowerCase();
if(str === 'bmw') {
return str.toUpperCase();
}
if(str === 'ram') {
return str.toUpperCase();
}
if (str === 'mercedes-benz'){
return "Mercedes-Benz";
}
spliters.forEach(spliter => {
str = str.split(spliter).map(word => word.charAt(0).toUpperCase() + word.slice(1)).join(' ');
});
return str;
}
function hideHi() {
document.getElementById("t1a").style.display = "none";
document.getElementById("t2a").style.display = "none";
}
function showResults(){
document.getElementById("t1a").style.display = "block";
document.getElementById("t2a").style.display = "block";
}
</script>
</head>
<body onload="hideHi()">
<table align="center">
<tr>
<td align="center">
<input type="text" id="b12" placeholder="Enter VIN" name="b12" maxlength="100"/>
</td>
</tr>
<tr>
<td align="center">
<button id="submit_btn" onclick="showResults()">Submit</button>
</td>
</tr>
</table>
<br>
<br>
<div id="t1a">
<table align="center">
<tr>
<td>Manufacturer:</td> <!--"Manufacturer"-->
<td id="t1"></td>
</tr>
<tr>
<td>Year:</td> <!--"ModelYear"-->
<td id="t2"></td>
</tr>
<tr>
<td>Make:</td> <!--"Make"-->
<td id="t3"></td>
</tr>
<tr>
<td>Model:</td> <!--"Model"-->
<td id="t4"></td>
</tr>
<tr>
<td>Body Style:</td> <!--"BodyClass"-->
<td id="t5"></td>
</tr>
<tr>
<td>Displacement:</td> <!--"DisplacementL"-->
<td id="t6"></td>
</tr>
<tr>
<td>Number of Cylinders:</td> <!--"EngineCylinders"-->
<td id="t7"></td>
</tr>
<tr>
<td>Horsepower:</td> <!--"EngineHP"-->
<td id="t8"></td>
</tr>
</table>
</div>
<br>
<textarea id="t2a" rows="15" cols="100"></textarea>
</body>
</html>

你可以使用Math.round来实现这一点：

Math.round(4.163000 * 10) / 10

您可以在数字对象中使用toFixed()方法


function roundNum(num,precision) {
return Number.parseFloat(num).toFixed(precision);
}
console.log(roundNum(14.163000,1));

显然地

toPrecision(( 返回格式化为指定长度的数字。

toFixed(( 返回小数点后的 n 个长度。

谢谢@radarbob

相关内容

最新更新

热门标签：