我的表格是：

<form enctype="multipart/form-data" action="" method="post">
  <input type="file" name="songs[]" id="songs" multiple="multiple">
  <input type="submit" value="submit">
</form>

我想在使用表单选择文件后获取文件名（在按下提交之前）。

我使用了这段代码：

var song_file = jQuery('#songs')[0].files[0]
  if(song_file){
  alert(song_file.name);
}

和

var filename = jQuery('#songs').prop("files")[0]['name'];
alert(filename);

但是有一个控制台错误： Uncaught TypeError: Cannot read property 'name' of undefined

我怎么能解决这个问题？

我如何使用该文件获取完整的URL？

例如：一个网址是：http://website.com/wp-content/uploads/2015/12/mpthreetest.mp3

另一个问题是：http://website.com/wp-content/uploads/2013/09/mpthreetest.mp3

所以我只需要在url上修复日期，我将从代码中获取文件名

Answer 1

未捕获的TypeError：无法读取未定义的属性“名称”

这可能是指jQuery('#songs').prop("files")[0]['name']。

以下是一个空的jQuery对象：

jQuery('#songs').prop("files")

要回答您的问题“我如何解决这个问题”，请先查看选择器jQuery('#songs').prop("files")与之匹配的原因。

修改

检查ID为songs的元素，您能看到files属性吗？它是一个阵列吗？它包含什么吗？第一个元素是否包含名称属性？

您的错误也可能来自alert行：alert(song_file.name);

只需检查控制台，它就会指向正确的行。

Answer 2

看起来你在页面加载时看它，当它仍然是空的时候。您应该查看输入字段的任何更改事件上的文件，如下所示：

<强>的jQuery

jQuery(document).ready(function() {
  jQuery("input:file").change(function(event) {
    var song_file = $('#songs')[0].files[0];
    if (song_file) {
      alert(song_file.name);
    }
  });
})

工作jsFiddle

上传文件jquery时未捕获类型错误

我的表格是：

我使用了这段代码：

和

2 个答案: