我正在学习 html 和 javascript，我想知道是否可以执行以下操作：使用文件输入上传文件时，希望将上传的文件名（不带路径）写入文件输入字段。这可能吗？下面是我的代码，但无法获得任何链接来解释如何为新手做这件事。抱歉，这是一个非常愚蠢的问题，但我想知道您是否可以在不涉及服务器的情况下仅使用 javascript（不是 jQuery）和 HTML。
<html>
<head>
<script type="text/javascript">
(function alertFilename()
{
var thefile = document.getElementById('thefile');
//here some action to write the filename in the input text
}
</script>
</head>
<body>
<form>
<input type="file" id="thefile" style="display: none;" />
<input type="button" value="Browse File..." onclick="document.getElementById('thefile').click();" />
<br> <br>The name of the uploaded file is:
<input type="text" name="some_text" id="some_text" />
</form>
</body>
</html>
这是一个完整的例子 JavaScript:
var filename;
document.getElementById('fileInput').onchange = function () {
filename = this.value.split(String.fromCharCode(92));
document.getElementById("some_text").value = filename[filename.length-1];
};
HTML：
<form>
<input type="file" id="fileInput" style="display: none;" />
<input type="button" value="Browse File..." onclick="document.getElementById('fileInput').click();" />
<br> <br>The name of the uploaded file is:
<input type="text" name="some_text" id="some_text" />
</form>
希望你觉得它有用，Asaf
对于新人：
document.getElementById("thefile").onchange = function() {
document.getElementById("some_text").value = this.files[0].name;
};
/* BELOW FULLPATH VERSION (depending on browser)
document.getElementById("thefile").onchange = function () {
document.getElementById("some_text").value = this.value;
};*/<form>
<input type="file" id="thefile" style="display: none;" />
<input type="button" value="Browse File..." onclick="document.getElementById('thefile').click();" />
<br>
<br>The name of the uploaded file is:
<input type="text" name="some_text" id="some_text" />
</form>只需获取文件输入的值，将其拆分并获取最后一个索引：
Filename = document.getElementById('fileinput').value.split('/') [2];// 或者这里返回的最后一个索引，因为最后一个索引总是文件名
（对不起，无法格式化我的答案。我用智能手机回答）
我在页面上使用 mp3 播放器，我也很感兴趣，只在播放器前显示文件名。 这是播放器：
您的浏览器不支持音频元素。