使用 dat.GUI 按钮加载文件？

【问题标题】：Load a file using a dat.GUI button?使用 dat.GUI 按钮加载文件？
【发布时间】：2014-05-01 22:49:12
【问题描述】：

我已经知道如何使用 dat.GUI 创建按钮（传递此问题中描述的函数：Is it possible to create a button using dat.gui）。我想制作一个触发加载文件事件的按钮，就像您对<input type="file" id="file" name="file" enctype="multipart/form-data" /> 所做的那样这可能吗？

【问题讨论】：

标签： javascript html input-type-file dat.gui

【解决方案1】：

（基于Programmatically trigger "select file" dialog box）

您从 dat.GUI 按钮的功能中调用隐藏的输入按钮。

<input id="myInput" type="file" style="visibility:hidden" />

<script>
var params = {
    loadFile : function() { 
            document.getElementById('myInput').click();
    }
};
var gui = new dat.GUI();
gui.add(params, 'loadFile').name('Load CSV file');
</script>

【讨论】：

我意识到这有点老了，但这绝对不需要 jquery。将$('#myInput').click(); 替换为document.getElementById("myInput").click()，它的工作原理是一样的。