javascript - Js函数不能与node和browserify一起使用

标签 javascript node.js browserify

我是 Node 和 browserify 的初学者,我遇到了一个问题,如果我使用 browserify,则错误中的输入或按​​钮来自 html 的功能将无法工作 pickCSV 未定义

因为它是html中的onchange,但调用时不起作用,如果我不使用browserify,它可以正常工作,但我需要browserify,因为我将使用node comm mysql作为银行的选择,我接受建议对于此应用程序以及在客户端运行 Node 的提示

html

 <!DOCTYPE html>
   <html>
   <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user- 
    scalable=no" />
   <title>SIM TELEGESTÃO</title>
   <link rel="stylesheet" href="node_modules/leaflet/dist/leaflet.css" />
   <script src="node_modules/leaflet/dist/leaflet-src.js"></script>
   <link rel="stylesheet" type="text/css" href="style.css">
   </head>
   <body>
   <div id="map"></div>
   <input type="file" id="inputCSV" onchange="pegarCSV(this)">
   <script src="bundle.js"></script>
   </body>
   </html>

JS

   // require modules
      var L = require('leaflet');
      var $ = require('jquery');
      var mysql = require('mysql');

      var tcsv = [];
      var nMuc;
      var arMuc= [];
      var bounds = [];
      var arMu = [];
      var leitorDeCSV = new FileReader();
      var tcsv1 = [];
      var achMuc;
      var lcz2;
      var selMuc = [];
      // Create the map
      var map = L.map('map').setView([-90.59431,-70.82561], 18);

      // Indicate leaflet the specific location of the images folder that it needs to render the page
      L.Icon.Default.imagePath = 'node_modules/leaflet/dist/images/';

      // Use OpenStreetMap tiles and attribution
      var osmTiles = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
      var attribution = '© OpenStreetMap contributors';

      // Create the basemap and add it to the map
      L.tileLayer(osmTiles, {
      maxZoom: 18,
      attribution: attribution
      }).addTo(map);


     function pegarCSV (inputFile){
      var file = inputFile.files[0];
      leitorDeCSV.readAsText(file);
      leitorDeCSV.onload = leCSV;
     }

最佳答案

获取require browserify 的工作是将您的整个代码包装到一个函数中,因此您在文件中定义的所有函数将在全局范围内不可用。这以及其他原因是您不应该使用内联事件处理程序(属性)来注册事件的原因,这些事件处理程序仅适用于全局范围内可见的函数。

你想做的是改变<input type="file" id="inputCSV" onchange="pegarCSV(this)"><input type="file" id="inputCSV">

并将以下内容添加到文件末尾:

document.getElementById('inputCSV').addEventListener('change', 
  function(event) {
    pegarCSV(event.currentTarget);
  }, false)

关于javascript - Js函数不能与node和browserify一起使用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61390110/

相关文章:

browserify 中的 ckeditor : home dir error

javascript - Watchify 可以获取对 html 文件的更改吗?

javascript - Javascript 中的参数和对象文字

node.js - Apache 代理后面的 Sockjs/socketio 断开连接延迟

javascript - 在 for 循环中错误地传递回调参数

mysql - Sequelize 映射不能使用 max 和 col

node.js - JestJS 测试不会因错误而失败

javascript - 如何使用 Karma 配置 browserify 以将转换 Stringify 用于 Mustache 模板?

javascript - 如何比较两个数组是否相等?

javascript - 使用 Javascript 在 forEach 中进行切换是不好的做法吗?