Я новичок в JQuery, и мне интересно, как именно я должен передавать параметры плагину, который будет ограничивать выполнение кода внутри плагина?
В принципе, я хочу вызвать плагин одним из двух способов:
$(".element").plugin(optionA);
$(".element").plugin(optionB);
ОБНОВИТЬ:
Если я вызываю optionA, выпадающее меню появляется при вводе текста в текстовое поле, которое после выбора фильтрует таблицу. Если я вызываю optionB, выпадающее меню не появляется, а вместо этого автоматически фильтрует таблицу. Таким образом, оба варианта предлагают разную функциональность на одном и том же объекте. По сути, я только хочу, чтобы код optionA внутри плагина выполнялся, если я передаю аргумент optionA, и я хочу, чтобы код optionB внутри плагина выполнялся, если я перехожу в optionB.
Вот основная структура плагина:
(function ($) {
$.fn.plugin = function (options) {
var settings = $.extend({
//Default Settings
}, options);
return this.each(function () {
//Do some code here
});
};
} (jQuery));
Поэтому мой вопрос:
Где я могу пройти в параметре?
Нужно ли мне делать что-то вроде ниже?
(function ($, optionA, optionB) { ...
Затем, когда я возвращаю функцию.each(), сделайте что-то вроде:
return this.each (function () {
if (optionA) { //execute code}
else if (optionB) { //execute code}
};
Или это больше похоже на это:
return this.each ( function (optionA) {
//Do optionA code here
});
return this.each ( function (optionB) {
//Do optionB code here
});
Или это не так? Если да, то как это делается?
(function ($) {
$.fn.plugin = function (options) {
var settings = $.extend({
filter : "optionA" // use A by default
}, options);
return this.each(function () {
if(settings.filter == "optionA"){
// DO SOMETHING HERE BY DEFAULT
}else if(settings.filter == "optionB"){
// DO SOMETHING IF "optionB" WAS SET
}
});
};
}(jQuery));
$(function(){ // DOM READY
// $(".element").plugin(); // will use A
// $(".element").plugin({filter:"optionA"}); // will use A
// $(".element").plugin({filter:"optionB"}); // will use B
});
пытаться:
var options = {
optionA: value1,
optionB: value2,
optionC: value3,
};
а также
$(".element").plugin(options);
точно так же, как функция css
:
$(".element").css({color:"#f65", display:"block"});