jQuery插件函數調用

Question

我想從我的頁面調用jquery插件函數，但失敗：(。我的代碼是：

var pstps=$('#psteps_simple_horiz_layout').psteps({
        steps_width_percentage: true,
        alter_width_at_viewport: '1300',
        steps_height_equalize: true
    });
    step_num=2;
    pstps.go_to_step(step_num);

該插件是Pine Steps向導。 它的代碼是：

function($) {
$.fn.psteps = function(options) {
    // Build main options before element iteration.
    var opts = $.extend({}, $.fn.psteps.defaults, options);

    // Iterate and transform each matched element.
    var all_elements = this;
    all_elements.each(function(){
        var psteps = $(this);
        psteps.psteps_version = "0.0.1alpha";
        .......................................................
        psteps.go_to_step = function(step_num){
            var last_active_title = psteps.find('.step-title.last-active'),
            .......................................................
        };
        .......................................................
        this.pines_steps = psteps;
    });

    return all_elements;
};

當我運行代碼時，出現錯誤：

Uncaught TypeError: undefined is not a function

Answer 1

由於go_to_steps不是jQuery擴展（並且psteps()的返回值是原始jQuery對象psteps() ，因此在以下行中失敗了：

pstps.go_to_step(step_num);

您需要實際插件的實例。 查看插件代碼，它將實例作為屬性連接到DOM元素pines_steps ，因此您需要將該屬性作為類實例：

var pstps=$('#psteps_simple_horiz_layout').psteps({
    steps_width_percentage: true,
    alter_width_at_viewport: '1300',
    steps_height_equalize: true
})[0].pines_steps;

那你可以打電話

pstps.go_to_step(step_num);

常用模式：

編寫插件的通常方法是在第一個參數中也接受字符串形式的函數名，因此它們可以調用如下方法：

$('#psteps_simple_horiz_layout').psteps("go_to_step", step_num);

但是此插件缺少執行此操作的代碼