获取文件的信息，并排序

最新推荐文章于 2024-06-21 10:23:19 发布

花狐狸60

最新推荐文章于 2024-06-21 10:23:19 发布

阅读量63

点赞数

文章标签： json

本文链接：https://blog.csdn.net/weixin_38637027/article/details/130984189

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Upload Files</title>
</head>
<body>
    <input type="file" id="filePicker" multiple>
    <button onclick="listFiles()">List Files</button>
    <label>Sort By:</label>
    <select id="sortBy" onchange="listFiles()">
        <option value="name">Name</option>
        <option value="size">Size</option>
        <option value="time">Create Time</option>
    </select>
    <pre id="fileList"></pre>

    <script>
        // 比较函数：根据不同的属性进行排序
        function compare(a, b, property) {
            if (property === "size") {
                return a[property] - b[property];
            } else if (property === "name") {
                return a[property].localeCompare(b[property]);
            } else if (property === "time") {
                return Date.parse(a[property]) - Date.parse(b[property]);
            }
        }

        // 获取所有选择的文件信息，并按照选择的属性进行排序
        function listFiles() {
            var fileList = document.getElementById('fileList');
            fileList.innerHTML = "";

            var files = document.getElementById('filePicker').files;

            var fileInfos = [];

            for (var i = 0; i < files.length; i++) {
                var fileInfo = {};
                fileInfo["Name"] = files[i].name;
                fileInfo["Size"] = files[i].size;
                fileInfo["Type"] = files[i].type;
                fileInfo["CreateTime"] = files[i].lastModifiedDate.toLocaleDateString();

                fileInfos.push(fileInfo);
            }

            // 获取选择的排序属性
            var property = document.getElementById("sortBy").value;

            // 根据选定属性对文件信息进行排序
            fileInfos.sort(function(a, b) {
                return compare(a, b, property);
            });

            // 将文件信息以 JSON 形式输出
            fileList.innerHTML = JSON.stringify(fileInfos, null, "\t");
        }
    </script>
</body>
</html>