클래스가 onClick 이벤트를 정의하지 않았습니다

JS에 대한 새로운 클래스 구문을 사용합니다. 버튼을 누르면 클래스의 메서드를 호출하려고합니다. 이를 성취하기 위해이 방법을 정적으로 설정했습니다.클래스가 onClick 이벤트를 정의하지 않았습니다

class NoteController { // The controller class 
    constructor() { // Initialization 
     // ... 
    } 

    static CreateNote() { // The method to call - static 
     // .... 
    } 
} 




<!DOCTYPE html> 
<html> 

<head> 

    // .... 
    <script src="NoteController.js"></script> // Link the js file to the html file 

</head> 

<body> 

    // .... 
    <button type="button" id="btnCreateNote" onclick="NoteController.CreateNote()">Create</button> // call the method 

</body> 

</html>

버튼을 클릭하면 NoteController가 정의되지 않는다고 표시됩니다. 나는 진짜로 얻지 않는다, 거기 틀린 무엇이.

내 프로젝트 폴더의 그림 :

아마이 도움이됩니다.

출처

2017-04-05 peterHasemann

HTML 페이지와 동일한 폴더에 NoteController.js가 있습니까? 정확한 오류는 무엇입니까? HTML 페이지에로드되지 않은 파일에 돈을 쓸 것입니다. – ProgrammerV5

방금 그림으로 내 게시물을 업데이트했습니다. – peterHasemann

응답 및 작동 예제를 추가했습니다. 구조 에서처럼 파일에서 분리되지는 않지만 작업 코드에서 누락 된 부분을 이해하는 데 도움이되기를 바랍니다. – ProgrammerV5

편집 : 수정은 정적 만들려면 :

<script> 
class NoteController { // The controller class 
    constructor() { // Initialization 
     // ... 
     alert('constructor called'); 
    } 

    CreateNote() { // The method to call - static 
     // .... 
     alert('create note'); 
    } 
} 
var nc=new NoteController(); 
console.log(nc); 
</script> 


<button type="button" id="btnCreateNote" onclick="nc.CreateNote()">Create</button> // call the method

작업 JSFiddle

,536 :

<script> 
class NoteController { // The controller class 
    constructor() { // Initialization 
     // ... 
     alert('constructor called'); 
    } 

    static CreateNote() { // The method to call - static 
     // .... 
     alert('create note'); 
    } 
} 
//var nc=new NoteController(); 
//console.log(nc); 
</script> 


<button type="button" id="btnCreateNote" onclick="NoteController.CreateNote()">Create</button> // call the method

JSFiddle

이 코드의 작업 예입니다

출처

2017-04-05 12:42:22 ProgrammerV5

메서드는 NoteController 인스턴스없이 호출하여 정적이어야합니다. –

실망 스럽지만 정적 방법으로 새로운 예를 추가했습니다. – ProgrammerV5

동일한 것을 테스트했지만 jsfiddle의 JS 영역으로 JS 코드를 옮기면 작동을 멈추고 그 이유는 확실하지 않습니다. [this fiddle] (https://jsfiddle.net/69b06hvj)를 확인하십시오. –

NoteController.js에 대한 정보가 없으므로 NoteController.js에 아래 코드가 있다고 가정합니다.

function NoteController() 
    { 
    //variables 
    //sub functions 
    function CreateNote() 
    { 
     //code 
    } 
    }

이제 함수의 개체를 만들어 호출해야합니다.

<script src="NoteController.js"></script> 
<script> 
var _noteController=new NoteController(); 
</script> 

<body> 
    <button type="button" id="btnCreateNote" 
onclick="_noteController.CreateNote()">Create</button> 
</body>

출처

2017-04-05 12:36:53

아니요, 위에서 볼 수 있듯이이 클래스는 전체 클래스입니다. 비교적 새로운 구문입니다 – peterHasemann

버튼 요소를 검사하고 onclick에 대한 바인딩이 무엇인지 확인하고 HTML 렌더링 페이지에서 NoteController가 정의 된 방법을 확인하십시오. –

브라우저가 <script> 태그 안에 클래스를 포함 시키면 브라우저가 자바 스크립트 코드를 식별하고 실행하게됩니다!

출처

2017-04-05 12:51:01 TheLawliet94

클래스가 onClick 이벤트를 정의하지 않았습니다

답변

관련 문제