Question

我想更改input type=file选择的名称文件，但不起作用。

这是我的代码：

$("document").ready(function() {
  $('body').on('change', '#FileID', function() {
    var name = document.getElementById('FileID');
    name.files.item(0).name = Math.floor(Math.random() * 100000);
    console.log('Selected file: ' + name.files.item(0).name);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id='FileID' class='class1' type='file' name='Images' value='' />

Answer 1

对于在此结尾的任何试图摆脱文件名的人，请尝试将其转换为base64。这样，它就不会附加名称，您可以按需要上传它。我将为此保留一个使用reactJS的代码示例。

1：这是使用我们的函数调用onChange事件的输入文件类型：

<input onChange={this.handleBackgroundImagePreview} type="file" accept="image/png,image/gif,image/jpeg"></input>

2：然后将该图像转换为base64

handleBackgroundImagePreview = (e) =>{
  // Retrieves the selected Image or file
  const file = e.target.files[0]

  //Calling async file reader with a callback
  let fileBase64 = '';
  this.getBase64(file, (result) => {
      fileBase64 = result;
      console.log(fileBase64)
      //In here you could upload to the server the base 64 data as you want
  });
}

getBase64(file, cb) {
  let reader = new FileReader();
  reader.readAsDataURL(file);
  reader.onload = function () {
      cb(reader.result)
  };
  reader.onerror = function (error) {
      console.log('Error: ', error);
  };
}

更改名称由输入类型文件选择的文件

1 个答案: