javascript - 在 Electron 中动态添加选项元素到<select>

Question

请理解这个问题与 Electron 中的 jscript 有关。 我有两个 .js 文件要打开并读入单独的数组中。我将其设置为主类型函数内的两个函数。 每个都将在 JavaScript 内的 html 文件中调用。它们将填充选择选项或将选择选项添加到选择输入框。

我很难调用它们(数组)，因此可以将其读入选择选项代码。下面是 ('./app.js')

var zipArry = []; 
var zipResult = [];
var aniArry = [];
var aniResult = [];

var blah = (function() {

   function zipList(callback) {


    var lineReader = require('readline').createInterface({
    input: require('fs').createReadStream('.Text1.txt')
    });

    lineReader.on('line', function (line) {
        zipArry.push(line);
    });

    lineReader.on('close', function (line) {

    var Ncount = 0;
    for(var x =0; x < zipArry.length; x++){

        zipResult.push(zipArry[x]);

    }
  });
    callback(zipResult);
}



 function aniList(callback) {


    var lineReader = require('readline').createInterface({
    input: require('fs').createReadStream('./text2.txt')
    });

    lineReader.on('line', function (line) {
       aniArry.push(line);
    });

    lineReader.on('close', function (line) {

    var Ncount = 0;
    for(var x =0; x < aniArry.length; x++){

         aniResult.push(aniArry[x]);
        }

  });
   callback(aniResult);
 }
   return {
      ziplist: zipList,
      anilist: aniList
   };
}); 

   module.exports = blah;

这是包含 JavaScript 代码的 .html 文件的一部分。如果有办法让这变得更容易，请解释一下。我是菜鸟。

var blah = require('./apps2.js');
var Blah= new blah();          
Blah.ziplist();

var select = document.getElementById("zip");  
for (var i= 0; i<zipResult.length; i++){

  var el = document.createElement('option');
      var opt = zipResult[i];
      el.textContent = opt;
      el.value = opt;
      select.appendChild(el);
}

Answer 1

这就是答案。我改变了一些东西并创建了对象，然后将它们导出到 html 文件中。

var zipArry = []; 
var zipResult = [];
var aniArry = [];
var aniResult = [];

var blah = {

   ziplist: function zipList(callback) {


       var lineReader = require('readline').createInterface({
          input: require('fs').createReadStream('.Text1.txt')
       });

       lineReader.on('line', function (line) {
           zipArry.push(line);
       });

       lineReader.on('close', function (line) {

          var Ncount = 0;
          for(var x = 0; x < zipArry.length; x++){

             zipResult.push(zipArry[x]);

          }
          callback(zipResult);
       });

   }



   anilist: function aniList(callback) {


       var lineReader = require('readline').createInterface({
          input: require('fs').createReadStream('./text2.txt')
       });

       lineReader.on('line', function (line) {
           aniArry.push(line);
       });

       lineReader.on('close', function (line) {

           var Ncount = 0;
           for(var x = 0; x < aniArry.length; x++){

              aniResult.push(aniArry[x]);
           }
           callback(aniResult);
       });

    }

 }; 

   module.exports = blah;

在html文件中

var blah = require('./apps2.js');

Blah.ziplist(function(zipResult){

    var select = document.getElementById("zip");  
    for (var i = 0; i < zipResult.length; i++){

        var el = document.createElement('option');
        var opt = zipResult[i];
        el.textContent = opt;
        el.value = opt;
        select.appendChild(el);
    }
});

Blah.anilist(function(aniResult){

   var select = document.getElementById("ani");  
   for (var i = 0; i < aniResult.length; i++){

       var el = document.createElement('option');
       var opt = aniResult[i];
       el.textContent = opt;
       el.value = opt;
       select.appendChild(el);
   }
});