0

기본적으로 Dijit을 사용하여 위젯 인스턴스를 만드는 방법에는 선언 및 프로그래밍 방식이 있습니다. 필자가 원하는 것은 iconClass와 같은 소품을 선언적 접근 방식으로 설정하지만 이벤트 처리를 extern 스크립트 블록으로 남겨 두는 것입니다.Dijit 1.7+ 위젯 : 이벤트 로직을 현재와 분리하는 방법

나는 dojo/on으로 이벤트 로직을 직접 추가하려고 시도했지만 성공하지 못했습니다. dojo/dom.byId() 및 dijit/registery.byId()를 사용하여 위젯을 검색했습니다. 둘 다 작동하지 않습니다. 그래서 우리의 해결책은 다음과 같이 전역 기능에 이벤트 소품을 연결하는 것입니다.

<body class="claro"> 
<script type="text/javascript"> 
    require([ 
     "dojo/dom", 
     "dojo/on", 
     "dijit/registry", 
     "dijit/form/Button", 
     "dojo/parser", 
     "dojo/domReady!" 
    ], function (dom, on, registry) { 
     // both don't work 
     // on(dom.byId("btn1"), "click", function() {alert("hi");}); 
     // on(registry.byId("btn1"), "click", function() {alert("hi");}); 

     // this one works 
     btnClickListener = function(){alert("hi")}; 
    }); 
    // the global function 
    var btnClickListener; 
</script> 

<button id="btn1" data-dojo-type="dijit.form.Button" 
     data-dojo-props="iconClass: 'dijitIconNewTask', showLabel:false"> 
</button> 
<button id="btn2" data-dojo-type="dijit.form.Button" 
     data-dojo-props="iconClass: 'dijitIconNewTask', showLabel:false, onClick:btnClickListener"> 
</button> 

</body> 

더 좋은 해결책이 있습니까? 미리 감사드립니다!

답변

2

dojo/on이 작동하지만 코드가 실행되는 동안 dijits가 아직 인스턴스화되지 않았기 때문에 registry.byId("btn1")undefined을 반환합니다. 이 jsFiddle에서 볼 수 있듯이 dojo/ready에 코드를 입력하십시오. http://jsfiddle.net/phusick/tRSqC/

+0

와우, 그게 효과가있어 !! 감사!!! btw, dojo/ready와 dojo/domReady의 차이점을 말해 줄 수 있습니까? 다시 한 번 감사드립니다 – cn1h

+1

Dojo Documentation (http://dojotoolkit.org/reference-guide/1.7/dojo/ready.html) : "domReady와 달리 dojo.ready()는 우선 순위 대기열을 구현하므로 응용 프로그램이 어떤 콜백을 등록 할 수 있습니다 먼저 dojo/parser는 parseOnLoad를 사용할 때 사용자 콜백이 실행되기 전에 실행되도록 설정된다.이 경우 dojo.ready()는 여전히 위젯이나 다른 코드에 의존 할 수있다. 실행의 특정 순서. " – phusick

관련 문제