在 Javascript 中导入 xlsx 文件时如何手动强制 javascript 事件？

Posted 2023-05-07

【中文标题】在 Javascript 中导入 xlsx 文件时如何手动强制 javascript 事件？

【英文标题】：How can I force javascript event manually while importing the xlsx file in Javascript?

【发布时间】：2016-05-03 14:13:02

【问题描述】：

我正在使用下面的代码 sn-p 在 javascript 中导入 xlsx 文件。这段代码工作正常，我可以导入 xlsx。作为添加更改addEventListener，每当我选择（选择）文件事件时都会触发并导入文件。

 <input type="file" name="xlfile" id="xlf" /> 
 <br />
 <input type="button" id="import" value="Import" />
 //some other javascript code


  var xlf = document.getElementById('xlf');
  function handleFile(e) 
  var files = e.target.files;
  var f = files[0];
   
     var reader = new FileReader();
     var name = f.name;
     reader.onload = function(e) 
     var data = e.target.result;
     var wb;
     wb = X.read(data, type: 'binary');
     process_wb(wb);
    ;
    if(rABS) reader.readAsBinaryString(f);
    else reader.readAsArrayBuffer(f);



if(xlf.addEventListener) xlf.addEventListener('change', handleFile, false);

但我想在单击导入按钮时导入文件。为此，我将上面的行替换为：

var import= document.getElementById('import');
if(import.addEventListener) import.addEventListener('click', handleFile, false);

在这种情况下，我无法在handleFile(e) 方法中获取输入文件。

【问题讨论】：

“但我想在点击导入按钮时导入文件。” “导入文件”是什么意思？您是否尝试通过单击 input type="button" 元素从用户文件系统请求文件？

@guest271314 是的，我正在尝试单击导入按钮获取文件，我从 jakub 获得了答案，谢谢

【参考方案1】：

变量名“import”是一个保留字。尝试更改变量名称。

【参考方案2】：

您可以从 xlf 变量访问选定的文件。

var xlf = document.getElementById('xlf');
function handleFile(e) 
  var files = xlf.files;
  var f = files[0];
  var reader = new FileReader();
  var name = f.name;
  reader.onload = function(e) 
    var data = e.target.result;
    var wb;
    wb = X.read(data, type: 'binary');
    process_wb(wb);
  ;
  if(rABS) 
    reader.readAsBinaryString(f);
  else 
    reader.readAsArrayBuffer(f);

同时更改“导入”变量的名称。 import 是保留字，用于加载模块（ES2015 新增功能）。

var importButton = document.getElementById('import');
if (importButton.addEventListener) 
  importButton.addEventListener('click', handleFile, false);

【讨论】：

这是我需要的行 var files = xlf.files;非常感谢 Jakub，它运行良好。