2017-09-25 4 views
0

나는 공부를 목적으로 파일 업 로더 플러그인을 만들고 있는데, 원하는 방식으로 콜백을 받으려고 애 쓰고 있습니다. 간단히 말해,이 위젯은 file 유형의 입력 필드에 있습니다. 코드의 좀 더 설명하기 :jQuery UI 사용자 정의 이벤트를 올바르게 트리거하는 방법은 무엇입니까?

$.widget('ultimatum.uploadify', { 
    create: function() { 
    // Irrelevant code here 
    }, 

    _onChange: function(event) { 
    // Private function that is fired when an "change" event 
    // is triggered by the input. 
    var files = event.target.files; 
    var fileInfo = {}; 

    // When the file processing finish, I want to trigger this custom event: 
    this._trigger("fileready", null, fileInfo); 
    } 
}); 

좋아, 이런 식으로 일을, 내가 지금 같은 콜백 처리 할 수 ​​

$('#upload-files').uploadify({ 
    fileready: function(event, file) { 
    // My code here 
    } 
}); 

문제는 내가 지금처럼이 이벤트를 처리 할 것인지입니다 :

$('#upload-files').uploadify(); 
$('.upload-files').on('fileready', function(event, file) { 
    // My code here. 
}); 

이전 방법은 완벽하게 작동하지만 후자는 그렇지 않습니다. "on"을 사용하여 이런 방식으로 커스텀 jQuery 이벤트를 처리 할 수 ​​있습니까?

+0

한 셀렉터에는'# '이 표시되고 다른 셀렉터에는'.'가 표시됩니다. 그것이 문제라고 생각하십시오. – Twisty

답변

0

http://api.jqueryui.com/jQuery.widget/에서

이벤트

모든 위젯은 상태가 변경 될 때 사용자에게 알리도록 자신의 다양한 행동과 관련된 이벤트가 있습니다. 대부분의 위젯의 경우, 이벤트가 트리거되면 이름 앞에 위젯 이름이 붙고 소문자로 지정됩니다. 예를 들어 값이 변경 될 때마다 트리거되는 progressbar의 change 이벤트에 바인딩 할 수 있습니다.

$("#elem").bind("progressbarchange", function() {` 
    alert("The value has changed!"); 
}); 

각 이벤트 옵션으로 노출되는 해당 콜백을 갖는다. 우리가 원하는 경우 progressbarchange 이벤트에 바인딩하는 대신 progressbar의 change 콜백에 연결할 수 있습니다.

$("#elem").progressbar({ 
    change: function() { 
    alert("The value has changed!"); 
    } 
}); 

모든 위젯은 인스턴스에 트리거되는 생성 이벤트가 있습니다. 같은

그래서 위젯을 위해,이 보일 것이다 :

$('#upload-files').uploadify(); 
$('#upload-files').on('uploadifyfileready', function(event, file) { 
    // My code here. 
}); 

내가 코멘트에서 언급 한 바와 같이, 나는 $('.upload-files') 오타가 될 수 있다는 것을 생각하고, 적절한 선택은 $('#upload-files')이다.