Question

所以我已经阅读了一些教程，我仍然很困惑如何将我的特定标记系统变成一个可用的插件。

我使用一堆函数声明了以下对象：

var Tags = {};

Tags.Class = function() {
  ...
};

然后我宣布原型：

Tags.TaggingForm = new Tags.Class();

// Only takes text input fields for now!
Tags.TaggingForm.prototype = {
    initialize: function(tag_field){
       ...
    },
    hideInputField: function() {
      ...
    },

然后我有使用该对象的实际函数调用：

Tags.make_tagging_input = function (id) {

var

 tagger = new Tags.TaggingForm(id);
...
 }

我只是想知道如何将它变成一个插件：当前我称之为：

window.g_gloab_var = Tags.make_tagging_input("#id");

这个骨架不断被建议，但我不确定如何应用它：

//You need an anonymous function to wrap around your function to avoid conflict

（函数（$）{

//Attach this new method to jQuery
$.fn.extend({ 

    //This is where you write your plugin's name
    tags_input: function() {

        //Iterate over the current set of matched elements
        return this.each(function() {

            //code to be inserted here

        });
        }
    });

//pass jQuery to the function, 
//So that we will able to use any valid Javascript variable name 
//to replace "$" SIGN. But, we'll stick to $ (I like dollar sign: ) )       
})(jQuery);

Answer 1

现在没有时间深入研究这个问题，但我最喜欢的插件创建样板是Stefan Gabos's

好评，很容易理解。希望有所帮助。我稍后会在有更多时间的情况下回来查看，但希望现在这有用。

Answer 2

您可以使用原始代码并使用以下插件：

(function($) {

// your original code here
$.fn.extend({ 

    tags_input: function(options) {

        //Iterate over the current set of matched elements
        // that we would call via $(selector).tags_input(options);
        // e.g. $('.tags_input').tags_input({a: true, b: "some string"});
        return this.each(function() {

            // call your plugin here,
            // options can be an object of parameters to the plugin

            // using your code and calling it on "this"
            // e.g. Tags.make_tagging_input("#" + this.id);

        });
        }
    });

})(jQuery);

将jQuery对象/代码转换为插件

2 个答案: