addEventListener가 호출하는 함수 내에서 함수를 호출 할 수 없습니다 [해결]

기본적으로 .csv 파일에서 구성을로드하고이를 사용하여 HTML 페이지를 설정하려고합니다. 좀 파고 들자 나는 FileReader와 AddEventListener의 일반적인 해결책을 발견했다. 내 HTML은 이렇게 보입니다 :addEventListener가 호출하는 함수 내에서 함수를 호출 할 수 없습니다 [해결]

편집 : 문제가 해결되었습니다. 코드는 다음과 같습니다.

<html> 
    <head> 
     <script src="kernel.js"></script> 
     <script> 
      var k = new kernel(); 
     </script> 
    </head> 

    <body> 

     <input type="file" id="file-input" /> 
     <script> 
      document.getElementById('file-input').addEventListener('change', k.readSingleFile, false); 
     </script> 

     <!-- Tables and stuff that i want to modify --> 

    </body> 
</html>

kernel.js :

function kernel() { 

    var self = this; 
    this.config = null; 

    this.readSingleFile = function(e) { 

     var file = e.target.files[0]; 
     if (!file) return null; 

     var reader = new FileReader(); 
     reader.onload = function(e) { self.loadConfig(e); }; 
     reader.readAsText(file); 

    } 

    this.loadConfig = function(e) { 

     this.config = e.target.result; 
     console.log(this.config); 

     // Do more stuff 

    } 

}

돔.

출처

2017-02-27 Dom Kiki

. 커널 함수에서'var self = this; '를 추가하고'var reader = self.readSingleFile (e); –

내 브라우저는() 함수를 사용하지 않고'function kernel {'을 좋아하지 않습니다. – mplungjan

추신 : 다음에'<>'버튼을 눌러 [mcve] – mplungjan

실행 컨텍스트가 손실됩니다. 당신은 Function.prototype.bind 명시 적으로 kernel.loadConfig 기능 kernel 객체를 결합하여 문제를 해결할 수 :

document.getElementById('file-input') 
    .addEventListener('change', kernel.loadConfig.bind(kernel), false);

익명 함수를 사용하여 이벤트 핸들러로도 작동합니다 : 당신은 올바른 컨텍스트를 바인드해야

document.getElementById('file-input') 
    .addEventListener('change', function() { 
    kernel.loadConfig(); 
    }, false);

출처

2017-02-27 13:46:24 dfsq

addEventListener가 호출하는 함수 내에서 함수를 호출 할 수 없습니다 [해결]

답변

관련 문제