jQueryプラグイン：一般公開されている関数ですか？

Question

jQueryプラグインを変更しています。

プラグインはタグシステムで、jQueryのオートコンプリートに基づいてオートコンプリートされています。

現在、どのタグが選択されているかを調べる方法はありません（作成されたリスト項目を解析する以外に）。

私はリストを含むtagsという配列を管理するようにプラグインを変更しました。

しかし、今は配列に到達する方法が必要です。あなたは私が行うことができるようにしたいどのような

$('#id').tagit({availableTags: 'tags.php'});

を呼び出し、それを初期化する

はタグのリストを取得する

$('#id').tagit('tags');または$('#id').tagit().tags();

ような呼び出しものです。

このコードを変更してその機能を追加するにはどうすればよいですか？これが機能するかどう

(function($) { 

    $.fn.tagit = function(options) { 

     var tags = []; 

     var defaults = { 
      availableTags: [], 
      allowSpace: false 
     }; 

     var options = $.extend(defaults, options); 

     var el = this; 

     const BACKSPACE = 8; 
     const ENTER = 13; 
     const SPACE = 32; 
     const COMMA = 44; 

     // add the tagit CSS class. 
     el.addClass("tagit"); 

     // create the input field. 
     var html_input_field = "<li class=\"tagit-new\"><input class=\"tagit-input\" type=\"text\" /></li>\n"; 
     el.html(html_input_field); 

     tag_input = el.children(".tagit-new").children(".tagit-input"); 

     $(this).click(function(e) { 
      if (e.target.tagName == 'A') { 
       // Removes a tag when the little 'x' is clicked. 
       // Event is binded to the UL, otherwise a new tag (LI > A) wouldn't have this event attached to it. 
       $(e.target).parent().remove(); 
      } 
      else { 
       // Sets the focus() to the input field, if the user clicks anywhere inside the UL. 
       // This is needed because the input field needs to be of a small size. 
       tag_input.focus(); 
      } 
     }); 

     tag_input.keydown(function(event) { 
      if (event.which == BACKSPACE) { 
       if (tag_input.val() == "") { 
        // When backspace is pressed, the last tag is deleted. 
        tags.pop(); 
        $(el).children(".tagit-choice:last").remove(); 
       } 
      } 
      // Comma/Space/Enter are all valid delimiters for new tags. 
      else if (event.which == COMMA || (event.which == SPACE && !options.allowSpace) || event.which == ENTER) { 
       event.preventDefault(); 

       var typed = tag_input.val(); 
       typed = typed.replace(/,+$/, ""); 
       typed = typed.trim(); 

       if (typed != "") { 
        if (is_new(typed)) { 
         create_choice(typed); 
        } 
        // Cleaning the input. 
        tag_input.val(""); 
       } 
      } 
     }); 

     tag_input.autocomplete({ 
      source: options.availableTags, 
      select: function(event, ui) { 
       if (is_new(ui.item.value)) { 
        create_choice(ui.item.value); 
       } 
       // Cleaning the input. 
       tag_input.val(""); 

       // Preventing the tag input to be update with the chosen value. 
       return false; 
      } 
     }); 

     function is_new(value) { 
      if (value in oc(tags)) 
       return false; 
      return true; 
     } 

     function create_choice(value) { 
      var el = ""; 
      el = "<li class=\"tagit-choice\">\n"; 
      el += value + "\n"; 
      el += "<a class=\"tagit-close\">x</a>\n"; 
      el += "<input type=\"hidden\" style=\"display:none;\" value=\"" + value + "\" name=\"item[tags][]\">\n"; 
      el += "</li>\n"; 
      var li_search_tags = this.tag_input.parent(); 
      $(el).insertBefore(li_search_tags); 
      this.tag_input.val(""); 
      tags.push(value); 
     } 

     function oc(a) { 
      var o = {}; 
      for (var i = 0; i < a.length; i++) { 
       o[a[i]] = ''; 
      } 
      return o; 
     } 
    }; 

    String.prototype.trim = function() { 
     return this.replace(/^\s+|\s+$/g, ""); 
    }; 

})(jQuery); 

Answer 1

もう少し、しかしでプラグインをビルドしてみてください

Answer 2

わからないが、あなたは$.fn.tagit以内にこれを試みることができる：

el.tags = function() { 
    return tags; 
} 

その後、tags配列を返すべきです。

// Inside the plugin 
var tags = []; 
this.data('tagit-tags', tags); 

は次にそれを使用する：努力の

// Initialise, as you had before 
$('#id').tagit({availableTags: 'tags.php'}); 
// Get tags 
var tags = $('#id').data('tagit-tags'); 

Answer 3

少なくとも目障りな方法は、単に要素上のデータとしてtagsを添付することですjQuery UI - 個々のコンポーネントの状態を維持し、作成後にパブリックメソッドを提供し、イベントをパブリッシュします。それは使用することが非常に簡単です：

$('#id').tagit("getTags");