开发者

Exposing public methods in XUI JS framework plugin?

I've created a plugin for XUI, for example:

xui.extend({
    myPlugin : function(){

        var options = [];

        function methodOne(obj){

        }

        function methodTwo(){

        }
    }
});

And now I can call:

<script type="text/javascript">
xui.ready(function(){

    // call my plugin on an XUI object
    x$('element').myPlugin();

});
</script>

But I also need to be able to access some of the methods within the plugin, something like this (this code doesn't work, but illustrates what I'm trying to be able to achieve)

<script type="text/javascript">
xui.ready(function(){

    // call my plugin on an XUI object
    x$('element').myPlugin();

    var foo = bar;

    // call one of my methods?
    xui.fn.myPlugin.methodOne(foo);

});
</script>

Could anyone with a bit more experience with the XUI mobile framework lend a hand? Cheers

EDIT **

The below works, though it probably isn't very elegant...

xui.extend({
    myPlugin : function(){

        // create an API object
        var api = {
            'publicOne' : function(obj){
                return methodOne(obj)
            }
        };

        // add our API object to prototype
        xui.fn.myPlugin.api = api;

        /**
        * the functions of the plugin
        **/

        // we'll expose this in the API object
        function methodOne(obj){
            // Do something with obj...
        }

        function methodTwo(){

        }
    }
});

And then on the page I can use this:

<script type="text/javascript">
xui.ready(function(){

    // call my plugin on an XUI object, which does its thing
    x$('element').myPlugin();

    // arbitary
    var foo = x$('#bar');

    // call one of the methods statically
    xui.fn.myPlugin.api.pluginOne(foo);

}开发者_运维技巧);
</script>

To explain the purpose, I'm creating something very similar to JQTouch, but of course without relying on the mega jQuery and sitting just on top of XUI. I have a method for handling page navigation, which handles 'page' transitions, but I need to be able to trigger the method programmatically as well.

Maybe the above will help other XUI folks, it's currently working for me but maybe could be improved?


Liam what would be more useful is probably understanding the reason you would want to do that? You could always expose the function through a callback.

xui.extend({
    myPlugin : function(callback){

        var options = [];

        function methodOne(obj){

        }

        function methodTwo(){

        }

        if(typeof callback === 'function') {
            return callback(this);
        }
    }
});

Then call it like this:

<script type="text/javascript">
xui.ready(function(){

    // call my plugin on an XUI object
    x$('element').myPlugin(function(myPublic) {
        var foo = bar;

        // call one of my methods?
        myPublic.methodOne(foo);
    });
});
</script>

This is untested but should work.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜