jQuery 플러그인 : 콜백 기능 추가
플러그인 콜백 기능을 제공하려고하는데 약간 전통적인 방식으로 작동하고 싶습니다.
myPlugin({options}, function() {
/* code to execute */
});
또는
myPlugin({options}, anotherFunction());
코드에서 해당 매개 변수를 어떻게 처리합니까? 하나의 완전한 엔티티로 취급됩니까? 실행 코드를 어디에 둘지 확실히 알고 있지만 코드를 실행하려면 어떻게해야합니까? 이 주제에 대한 많은 문헌을 찾을 수없는 것 같습니다.
플러그인에서 콜백을 실행하기 만하면됩니다.
$.fn.myPlugin = function(options, callback) {
if (typeof callback == 'function') { // make sure the callback is a function
callback.call(this); // brings the scope to the callback
}
};
옵션 객체에서 콜백을 가질 수도 있습니다.
$.fn.myPlugin = function() {
// extend the options from pre-defined values:
var options = $.extend({
callback: function() {}
}, arguments[0] || {});
// call the callback and apply the scope:
options.callback.call(this);
};
다음과 같이 사용하십시오.
$('.elem').myPlugin({
callback: function() {
// some action
}
});
귀하의 질문을 올바르게 이해했는지 모르겠습니다. 그러나 두 번째 버전의 경우 : 이것은 anotherFunction
즉시 호출 됩니다.
기본적으로 플러그인은 다음과 같은 기능이어야합니다.
var myPlugin = function(options, callback) {
//do something with options here
//call callback
if(callback) callback();
}
함수 객체 를 콜백 으로 제공해야 하므로 function(){...}
또는 anotherFunction
(없이 ()
).
과거의 돌풍을 되 살리십시오.
예를 들어 두 개의 인수가 전달 된 경우 주목할 가치가 있습니다.
$.fn.plugin = function(options, callback) { ... };
그런 다음 options 인수없이 플러그인을 호출하지만 콜백을 사용하면 문제가 발생합니다.
$(selector).plugin(function() {...});
좀 더 유연하게 만들기 위해 이것을 사용합니다.
if($.isFunction(options)) { callback = options }
도움이 될 것 같아요
// Create closure.
(function( $ ) {
// This is the easiest way to have default options.
var settings = $.extend({
// These are the defaults.
onready: function(){},
//Rest of the Settings goes here...
}, options );
// Plugin definition.
$.fn.hilight = function( options ) {
//Here's the Callback
settings.onready.call(this);
//Your plugin code goes Here
};
// End of closure.
})( jQuery );
자신의 jQuery 플러그인 만들기에 대한 기사를 공유했습니다. http://mycodingtricks.com/jquery/how-to-create-your-own-jquery-plugin/ 확인해야한다고 생각합니다 .
두 번째 매개 변수를 사용하도록 플러그인 함수를 변경하십시오. 사용자가 함수를 전달한다고 가정하면 해당 매개 변수를 일반 함수로 처리 할 수 있습니다.
콜백을 options 매개 변수의 속성으로 만들 수도 있습니다.
For example:
$.fn.myPlugin = function(options, callback) {
...
if(callback) //If the caller supplied a callback
callback(someParam);
...
});
An example bit late, but it can be useful. Using arguments can create the same functionality.
$.fn.myPlugin = function() {
var el = $(this[0]);
var args = arguments[0] || {};
var callBack = arguments[1];
.....
if (typeof callback == 'function') {
callback.call(this);
}
}
참고URL : https://stackoverflow.com/questions/2534436/jquery-plugin-adding-callback-functionality
'program story' 카테고리의 다른 글
jQuery 드래그 앤 드롭으로 클릭 이벤트 방지 (0) | 2020.09.21 |
---|---|
CSS를 사용하여 셀 사이에 공백 추가 (td) (0) | 2020.09.21 |
타임 스탬프 형식으로 현재 NSDate 가져 오기 (0) | 2020.09.20 |
배열을 N 길이의 청크로 분할 (0) | 2020.09.20 |
ES6 구문을 사용하여 onclick 이벤트를 통해 매개 변수를 전달하는 반응 (0) | 2020.09.20 |