JavaScript问题：button调用click()报错‘click不是函数’，如何解决？

核心原因 #

你看到console.log(fileButtons[0].click)输出javascript:uploadFiles();，是因为这个click属性其实是你在HTML中定义的onclick属性值——它是个字符串，不是可调用的函数，更不是DOM元素原生的click()方法。

正常情况下，DOM元素的click是用来模拟用户点击的原生方法，而onclick才是存储点击事件处理程序的属性。但你的环境中，元素的click属性被onclick的字符串值覆盖了，导致原生的click()方法无法正常调用，因此报错“不是函数”。

解决办法 #

1. 直接调用事件处理函数
   既然按钮点击的最终目的是执行uploadFiles()，没必要模拟点击，直接调用函数即可：

   uploadFiles();
   

2. 强制调用原生click()方法
   如果必须模拟点击（比如按钮还有其他绑定的事件需要触发），可以绕过被覆盖的属性，直接调用Element原型上的原生方法：

   let fileButton = document.getElementsByName('filemanagement_uploadbutton')[0];
   Element.prototype.click.call(fileButton);
   

3. 规范事件绑定方式（推荐）
   放弃HTML属性onclick，改用addEventListener绑定事件，这样能避免属性覆盖的问题，代码也更易维护：
   调整后的HTML：

   <input type="button" value="Upload"
          id="filemanagement_uploadbutton[0]"
          name="filemanagement_uploadbutton">
   

   JavaScript代码：

   let fileButton = document.getElementById('filemanagement_uploadbutton[0]');
   // 绑定事件
   fileButton.addEventListener('click', uploadFiles);
   // 模拟点击
   fileButton.click();
   

内容的提问来源于stack exchange，提问作者Steve G.