-3

我想知道下面的代码是如何工作的，因为我在一个获取文件名的网站上找到了这个，但我不完全理解它是如何工作的：

function handleFileSelect(evt) {
    var files = evt.target.files;
    localStorage["fname"] = files[0].name; //save the name for future use
}

上面的代码对于如下表单代码是否正确：

  <form action='imageupload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='return imageClickHandler(this);' class='imageuploadform' >
    <p><input name='fileImage' type='file' class='fileImage' /></p>
<iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px;solid;#fff;'></iframe></form>
4

1 回答 1

1

该函数已绑定可能绑定到该change文件输入字段的事件。

所以让我们分解一下。

function handleFileSelect(evt) {

当函数作为事件的侦听器绑定时，通常会传入一个表示该事件的对象。这是evt此事件处理函数接受的变量。

var files = evt.target.files;

对于 DOM 事件，事件对象通常有一个名为的属性target，它是对触发事件的 DOM 元素的引用。所以evt.target返回文件输入元素。

文件输入元素有一个名为 的属性files，它是用户选择的文件对象数组（请注意，可能只选择了一个文件，但它仍然是一个只有一个项目的数组）。该行将该数组分配给files局部变量。

localStorage["fname"] = files[0].name;

localStorage是作为 HTML5 的一部分引入的持久键值存储（类似于 cookie）。 "fname"是我们在其下存储值的键。并files[0].name获取第一个文件对象，并返回其name属性，有效地获取所选文件的名称。然后存储该值，因此即使您刷新页面，您也可以通过运行读取最后选择的文件名localStorage["fname"]

于 2012-04-17T00:43:13.260 回答