我正在使用ajax从api调用中获取数据。它工作正常。我只是想知道如何格式化distance_time以使其更具可读性和用户友好性？我已经查看了文档，似乎找不到可以快速转换的东西。有什么建议吗？
$.ajax({
url: 'https://exampleapi.com/key=my_key',
dataType: 'json',
type: 'GET',
contentType:'json',
success: function(data)
{
//console.log( data)
//get distance in miles
var distance_miles = data['route']['distance'];
//$('.distance_miles').html(distance_miles);
//get formatted time
var distance_time = data['route']['formattedTime'];
$('.distance_time').html(distance_time);
}
});
上面的代码输出：
"00:14:33";
这对程序员来说很好，但对用户来说并不那么违反直觉。
我想显示：
14 mins and 33 secs
如果有小时，它应该显示类似以下内容：
2 hours 14 mins and 45 secs
这并不完美，我很确定你可以用 for 句子减少代码量，但这是主要思想，当然你需要用你的数据替换字符串。
let distance_time = formatTimeString('02:10:01')
console.log(distance_time)
document.getElementById('time').innerHTML = distance_time
function formatTimeString(time) {
let arr = time.split(':')
let distance_time = ''
let hours = parseInt(arr[0])
let minutes = parseInt(arr[1])
let seconds = parseInt(arr[2])
if (hours > 0 ) {
distance_time += hours + ' hour'
hours > 1 ? distance_time += 's ' : ' '
}
if (minutes > 0) {
distance_time += minutes + ' minute'
minutes > 1 ? distance_time += 's ' : ' '
}
if (seconds > 0) {
distance_time += ' and ' + seconds + ' second'
seconds > 1 ? distance_time += 's ' : ' '
}
return distance_time
}<html>
<head>
<title>test</title>
</head>
<body>
The time you made is: <span id="time"></span>
</body>
</html>我希望这能帮助您找到更好的方法！
我不知道我是如何在文档中第一次错过这个的。一种快速而简单的方法是使用.replace()或replaceWith().更多细节在这里
这对我有用：
//get formatted time
var distance_time = data['route']['formattedTime'];
var distance_in_time = distance_time.replace(':',' hrs, ').replace(':',' Min and ') + ' secs.';
$('.distance_time').html(distance_in_time);
这将正确格式化您的字符串，并仅显示相关的时间后缀。还有一个用于填充0到数字的参数 - 您的问题没有证明您希望如何进行这种行为，所以我将其保留为选择(默认为true(
function formatTimeString(timeString, padZeros = true) {
let arr = timeString.split(':').map(x => parseInt(x));
let str = ['hour', 'min', 'sec'];
return arr.reduce((acc, num, i) => {
if (num <= 0) {
return acc;
} else {
let digit = (padZeros && num < 10) ? '0' + num : num;
let suffix = num > 1 ? str[i] + 's' : str[i];
return acc + `${digit} ${suffix} `;
}
}, '').replace(/(mins|min)/g, '$1 and').trim();
}
// Minutes and Seconds
console.log(formatTimeString("00:04:33", false));
console.log(formatTimeString("00:04:33", true));
// with Hours
console.log(formatTimeString("02:14:45", false));
console.log(formatTimeString("02:14:45", true));
// Just seconds
console.log(formatTimeString("00:00:50", false));
console.log(formatTimeString("00:00:50", true));