1

我希望你能帮我解决这个问题。我正在编写一个像这样工作的 jQuery 插件。当用户单击输入时，会出现一个弹出 div，其中包含一些字段供用户填写。

我试图实现的是，在初始化插件之后，我可以从插件内部调用一个方法，该方法将返回一个字段的值。

这是一些代码：

(function($) {
$.geoHelper = {};
$.fn.geoHelper = function(method) {
    return this.each(function() {
        var $elem = $(this);
        var $template = $('<div class="geoHelper geoHelper-close">' +
            '<div class="geoHelper-wrapper">' +
            '<label class="geoHelper-label">' +
            '<span>Calle:</span>' +
            '<input id="street" type="text" />' +
            '</label>' +                
            '</div>' +
            '</div>');
        var $defaults = {}
        var $settings = {}

        var $methods = {
            init: function() {
                $template.css('position', 'absolute')
                    .css('top', $elem.offset().top + $elem.outerHeight())
                    .css('left', $elem.offset().left);
                $elem.on('click', function() {
                    $('body').append($template);
                    $methods.open();
                });
            },
            open: function() {
                var itm = $('.geoHelper');
                itm.css('display', 'block');
                itm.switchClass('geoHelper-close', 'geoHelper-open', 100, 'easeInOutQuad');
            },
            close: function() {
                var itm = $('.geoHelper');
                itm.switchClass('geoHelper-open', 'geoHelper-close', {
                    duration: 100,
                    easing: 'easeInOutQuad',
                    complete: function() {
                        setTimeout(function() {
                            itm.css('display', 'none');
                        }, 100);
                    }
                });
            },
            locate: function() {

            },
            getAddress: function() {

            },
            setAddress: function() {

            },
            getFields: function() {
                return $template.find('#street').val();
            },
            loadMap: function(add) {                    
            },
            getAddress: function(pos, cb) {

            },
            getCoordinates: function(add, cb) {

            }
        };

        if ($methods[method])
            return $methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        else if (typeof method === 'object' || !method)
            return $methods.init.apply(this, arguments);
        else
            $.error('Method "' + method + '" does not exist in pluginName plugin!');
    });
}})(jQuery);

所以我像这样初始化插件：$('#geo').geoHelper();然后我想像这样调用getFields方法$('#geo').geoHelper('getFields);，但这会返回一个空值。

你能帮我解决这个问题吗？太感谢了！

4

0 回答 0