Question

我的应用程序是使用占位符构建的，当＆＃34; load＆＃34;点击。

<button id="loadbutton" type="button" class="btn btn-success" onclick="showTheFile()">Load</button></a>

showthefile()会做一些事情，然后拨打电话......

var keyMapLoc = '\\path\\to\\file.txt';
function readKeys(ffile) {
// read the keyfile
    var ffile = ffile || keyMapLoc;
    return fs.readFileSync(ffile, 'utf8');
}

这会将文件读入解析它的应用程序，yotta yotta。

I followed these instructions并使用了该演示。一旦应用程序打开，文件对话框就会弹出，我得到了。

<html>
<body>
<input style="display:none;" id="fileDialog" type="file" />
<script>
  function chooseFile(name) {
    var chooser = document.querySelector(name);
    chooser.addEventListener("change", function(evt) {
      console.log(this.value);
    }, false);

    chooser.click();  
  }
  chooseFile('#fileDialog');
</script>
</body>
</html>

然而，即使我理解如何弹出文件对话框并且我理解如何读取/解析文件，我也很难将这个非常抽象的示例应用到我现有的nwjs应用程序中。

根据我的应用程序的上述示例，我应该如何融入演示，以便＆＃34;加载＆＃34;按钮按预期运行加载文件？

Answer 1

由于您没有提供代码，我将退出演示。你需要做什么触发文件输入元素的click事件，然后触发a change活动，请致电readKeys()。

<!DOCTYPE html>
<html>
<body>
<input style="display:none;" id="fileDialog" type="file"/>

<button id="loadButton" type="button" class="btn btn-success"
        onclick="showTheFile()">Load</button>

<script>
    var fs = require('fs');
    var keyMapLoc = '\\path\\to\\file.txt';
    var chooser = document.querySelector("#fileDialog");

    // Set up the file chooser for the on change event
    chooser.addEventListener("change", function(evt) {
        // When we reach this point, it means the user has selected a file,
        // so invoke readKeys().
        // this.value contains the path to the selected file
        console.log(readKeys(this.value));
    }, false); 

    function showTheFile() {
        // Trigger click event on the chooser, this will bring up the
        // dialog
        chooser.click()
    }

    function readKeys(ffile) {
        var ffile = ffile || keyMapLoc;
        return fs.readFileSync(ffile, 'utf8');
    }
</script>
</body>
</html>

nw.js：如何构建文件对话框以打开文件？

1 个答案: