Question

我有一个可以使用不同方法加载数据的插件。我目前正在使用标志和if来运行正确的功能。我试图找出如何使用函数指针。

这是一个片段：

$.fn.shureTable = function(options) {  
    var defaults = {  
        loadMethod: populateFromArray
    };  


    return this.each(function() {
        var $this = $(this);

        function loadJson(json) {
            if (json.appendMode == 0)
                        jQuery('tbody', $this).empty();

            options.loadMethod(json.Rows);
        }
        function populateFromArray(rowArray){
        }
    }
}

我收到一条错误消息，说populateFromArray未定义。如何使用options控制使用哪个功能？

Answer 1

由于范围问题，您正在遇到问题。该函数不可用，因为它在每个语句中。

但是，您可以像this那样制作一个选项列表，然后传递您想要使用的选项。同样，您可以通过它来传递自定义函数。

<p id="red">Red colored</p>
<p id="green">Green colored</p>
<p id="blue">Blue colored</p>

<div>This is a custom function</div>

(function($){    
    $.fn.extend({
        color: function(method){
            // list of possible methods
            var methods = {
                red: function(a){ return '<span style="color:red;">'+a+'</span>' },
                green: function(a){ return '<span style="color:green;">'+a+'</span>' },
                blue: function(a){ return '<span style="color:blue;">'+a+'</span>' },
            }
            // assign the appropriate function based on the "method" argument
            var func = methods[method] || function(a){ return a; };

            // run through the elements and apply that function
            return this.each(function(i,e){
                $(e).html(func($(e).html()));
            });
        },
        color2: function(func){
            func = func || function(a){ return a; };
            return this.each(function(i,e){
                $(e).html(func($(e).html()));
            });
        }
    });
})(jQuery);

$('p').each(function(i,e){
    $(e).color($(e).attr('id'));
});

$('div').color2(function(a){
    return '<b style="color:#FF00FF">'+a+'</b>';
});

color可以传递方法对象中的名称。 color2可以传递一个完整的函数，因此您可以扩展您想要使用它的功能。（您可以根据参数的类型检查参数并更改行为，但这是为了演示）。

使用不同的功能加载数据

1 个答案: