当前位置：网站首页>JS format file unit display

JS format file unit display

2022-06-13 08:47:00 【fengyehongWorld】

Mode one 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>js Format file unit display </title>
</head>
<body>
    <input id="file" type="file" onchange="fileUpload(this)">
</body>
<script> //  File long transfer callback function  function fileUpload(obj) {
       const fileObj = obj.files[0]; //  Print the size of the long transmission file  console.log(formatFileSize(fileObj.size)); } //  Format file size  function formatFileSize(size) {
       if (!size || isNaN(Number(size))) {
       return '-'; } let index = 0; let k = size; const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB', 'BB']; if (size >= 1024) {
       while (k > 1024) {
       k = k / 1024; index++; } } return `${
        (k).toFixed(2)}${
        units[index]}`; } </script>
</html>

Mode two 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title> Calculate the size of the uploaded file </title>
</head>
<body>
    <input id="upload" type="file" />
    <div id="size"></div>
</body>
<script> document.querySelector("#upload").addEventListener("change", function({
       target}) {
       //  Get the uploaded file object  const uploadFile = target.files[0]; const sizeEle = document.querySelector("#size"); if(uploadFile.length === 0) {
       sizeEle.innerHTML = ''; sizeEle.style.display = 'none'; } else {
       //  Format the file size  sizeEle.innerHTML = formatFileSize(uploadFile.size); //  Set visible  sizeEle.style.display = 'block'; } }); //  Format the size of the uploaded file , Display in reasonable units  const formatFileSize = function(bytes) {
       const sufixes = ['B', 'kB', 'MB', 'GB', 'TB']; const i = Math.floor(Math.log(bytes) / Math.log(1024)); return `${
        (bytes / Math.pow(1024, i)).toFixed(2)} ${
        sufixes[i]}`; }; </script>
</html>
原网站

版权声明
本文为[fengyehongWorld]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202270537517252.html

边栏推荐

猜你喜欢

随机推荐