Как использовать функции в плагине

Question

Я работаю над JQuery plugin. Я совершенно не понимаю, как использовать этот плагин jQuery. Как я могу вызвать функцию плагина jQuery вне плагина?

Вот мой код плагина:

(function ($) {
    function _setValue(self, value) {
        ....
    }

    //Other functions

    $.fn.inputpicker = function (method) {
        if (!this.length) return this;
        if (typeof method == 'object' || !method) {
            return methods.init.apply(this, arguments);

        }
        else if (methods[method]) {
            return methods[method].apply(this, 
            Array.prototype.slice.call(arguments, 1));
        }
        else { $.error("Method " + method + " does not exist on 
        jQuery.inputpicker"); }
    }

});

Вы можете найти весь плагин здесь .

Теперь, как я могу использовать функцию _setValue в своих кодах?

Answer 1

Функция привязана к плагину и ведет себя как приватный метод объекта. Следовательно, вы не можете получить доступ к функции прямо за пределами плагина.

Вы можете обойти это, отредактировав плагин, например, так:

(function( $, document, window ) {

    function _setValue(self, value) {
        ....
    }

    // export the function to the global window object
    window.setValue = _setValue;
    ....

}( jQuery, document, window ));

Answer 2

Теперь, как я могу использовать функцию _setValue в моих собственных кодах?

Вы можете написать:

$('#test').inputpicker('val', 'your string');

Вызовите экземпляр inputpicker и передайте функцию и значение.

Значение должно соответствовать одному из атрибутов data :

$('#test').inputpicker({
    data:[ "Text 1", "Text 2", "Text 3" ],
    autoOpen: true
});
$('button').on('click', function(e) {
    $('#test').inputpicker('val', this.textContent);
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ukalpa/inputpicker@master/src/jquery.inputpicker.css">
<script src="https://cdn.jsdelivr.net/gh/ukalpa/inputpicker@master/src/jquery.inputpicker.js"></script>


<input class="form-control" id="test" value="2" />
<button type="button">Text 1</button>
<button type="button">Text 2</button>
<button type="button">Text 3</button>