0

Porto のカスタマイズされた JQuery Bootstrap Wizard を使用していますが、リンクを使用するときに、ウィザードの関連するタブに移動するように要求されました。

必要なのは、次のオブジェクト変数からすべてのプロパティを取得することだけです。

$('#w3').bootstrapWizard({
    tabClass: 'wizard-steps',
    nextSelector: 'ul.pager li.next',
    previousSelector: 'ul.pager li.previous',
    previousLinkSelector: 'ul.pager li.finish a.previous-link',
    firstSelector: null,
    lastSelector: null,
    onNext: function (tab, navigation, index, newindex) {
        var validated = $('#w3 form').valid();
        if (!validated) {
            $w3validator.focusInvalid();
            return false;
        }
    },
    onTabClick: function (tab, navigation, index, newindex) {
        if (newindex == index + 1) {
            return this.onNext(tab, navigation, index, newindex);
        } else if (newindex > index + 1) {
            return false;
        } else {
            return true;
        }
    },
    onTabChange: function (tab, navigation, index, newindex) {
        var $total = navigation.find('li').size() - 1;
        $w3finish[newindex != $total ? 'addClass' : 'removeClass']('hidden');
        $('#w3').find(this.nextSelector)[newindex == $total ? 'addClass' : 'removeClass']('hidden');
    },
    onTabShow: function (tab, navigation, index) {
        var $total = navigation.find('li').length - 1;
        var $current = index;
        var $percent = Math.floor(($current / $total) * 100);
        $('#w3').find('.progress-indicator').css({ 'width': $percent + '%' });
        tab.prevAll().addClass('completed');
        tab.nextAll().removeClass('completed');
    }
});

すべてのプロパティ (特に onTabClick プロパティ) を使用できるように、グローバル変数に入れる必要があります。

私は次の方法でそれをやろうとしました：

var $mainSettings = $.fn.bootstrapWizard;

問題は、$mainSettings に関数宣言のみが含まれていることです。

$.fn.bootstrapWizard; からすべてのプロパティを取得する正しい方法は何ですか? ?

4

1 に答える 1

0

この jquery プラグインが受け取る構成をどのように公開するかによって異なります。これを公開しない場合は、運が悪いです。ただし、構成を変数に割り当てて、その変数を jquery プラグインに渡すだけです。

var $mainSettings = {
    tabClass: 'wizard-steps',
    nextSelector: 'ul.pager li.next',
    previousSelector: 'ul.pager li.previous',
    previousLinkSelector: 'ul.pager li.finish a.previous-link',
    firstSelector: null,
    lastSelector: null,
    onNext: function (tab, navigation, index, newindex) {
        var validated = $('#w3 form').valid();
        if (!validated) {
            $w3validator.focusInvalid();
            return false;
        }
    },
    onTabClick: function (tab, navigation, index, newindex) {
        if (newindex == index + 1) {
            return this.onNext(tab, navigation, index, newindex);
        } else if (newindex > index + 1) {
            return false;
        } else {
            return true;
        }
    },
    onTabChange: function (tab, navigation, index, newindex) {
        var $total = navigation.find('li').size() - 1;
        $w3finish[newindex != $total ? 'addClass' : 'removeClass']('hidden');
        $('#w3').find(this.nextSelector)[newindex == $total ? 'addClass' : 'removeClass']('hidden');
    },
    onTabShow: function (tab, navigation, index) {
        var $total = navigation.find('li').length - 1;
        var $current = index;
        var $percent = Math.floor(($current / $total) * 100);
        $('#w3').find('.progress-indicator').css({ 'width': $percent + '%' });
        tab.prevAll().addClass('completed');
        tab.nextAll().removeClass('completed');
    }
};

$('#w3').bootstrapWizard($mainSettings);
于 2016-06-08T16:22:23.967 に答える