Question

我已经在我的项目中集成了以下代码，我想更改选择文件按钮的默认样式，但是当我选择文件时，文件总数不会显示。

如何显示文件总数而不是默认选择文件按钮？

任何帮助都将不胜感激。

<pre>
<html>
<head>
<style>
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
 .btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c;
}
 .fileinput-button {
    position: relative;
    overflow: hidden;
}
.fileinput-button input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    -ms-filter:'alpha(opacity=0)';
    font-size: 200px;
    direction: ltr;
    cursor: pointer;
}
</style>
</head>
<body>
<form method="POST" action="myurl"> <span class="btn btn-success fileinput-button">
        <span>Select file</span>

    <input type="file" name="file">
    </span>
</form>
</body>
</html>
</pre>

Answer 1

添加multiple属性以选择多个文件 -

获取所选文件信息 - （您必须在更改文件输入时执行此代码）

var files = document.getElementById("yourFileInputId").files;
for (var i = 0; i < files.length; i++)
    console.log(files[i].name);

如何显示所选文件的数量

1 个答案: