如何在javascript中调用函数对象中的子函数

时间:2022-11-07 16:56:28

I've checked the related questions on stack overflow, but can't seem to find an answer to my predicament. I'm trying to use a plugin for javascript (Tag it! - Tag Editor) and I need to find a way to call one of its functions "create_choice()" EDIT: at some point after it has been initiated. Is there a way after calling :

我已经检查了堆栈溢出的相关问题,但似乎无法找到我的困境的答案。我正在尝试使用javascript插件(标记它! - 标签编辑器),我需要找到一种方法来调用它的一个函数“create_choice()”EDIT:在它启动后的某个时刻。打电话后有办法吗?

$tagit = $("#mytags").tagit();

that I can then call something like

然后,我可以称之为

$tagit.create_choice('test123');

Here is a link for the example : http://levycarneiro.com/projects/tag-it/example.html

以下是该示例的链接:http://levycarneiro.com/projects/tag-it/example.html

Below is the code from the plugin if it is any help

如果是任何帮助,下面是插件的代码

(function($) {

    $.fn.tagit = function(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.keypress(function(event){
            if (event.which == BACKSPACE) {
                if (tag_input.val() == "") {
                    // When backspace is pressed, the last tag is deleted.
                    $(el).children(".tagit-choice:last").remove();
                }
            }
            // Comma/Space/Enter are all valid delimiters for new tags.
            else if (event.which == COMMA || event.which == SPACE || 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){
            var is_new = true;
            this.tag_input.parents("ul").children(".tagit-choice").each(function(i){
                n = $(this).children("input").val();
                if (value == n) {
                    is_new = false;
                }
            })
            return is_new;
        }
        function create_choice (value){
            var el = "";
            el  = "<li class=\"tagit-choice\">\n";
            el += value + "\n";
            el += "<a class=\"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("");
        }
    };

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

})(jQuery);

3 个解决方案

#1


2  

I've created a working example at http://jsfiddle.net/nickywaites/DnkBt/ but it does require making changes to the plugin.

我在http://jsfiddle.net/nickywaites/DnkBt/上创建了一个工作示例,但确实需要对插件进行更改。

#2


0  

Change

更改

$.fn.tagit = function(options) { ...

to

$.fn.tagit = function(options,callback) { ...

Add

if (callback && typeof callback == 'function') {
    callback();
}

after

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

Now you can call a function of your choice right after the tagit call:

现在,您可以在tagit调用后立即调用您选择的函数:

$tagit = $("#mytags").tagit(yourOptions, function(){
    alert('hi')!
});

#3


0  

You can try to add

你可以尝试添加

return this;

right after the function create_choice block. tagit will return itself and you can call make_choice or any function contained in .fn.tagit

在create_choice函数块之后。 tagit将自行返回,您可以调用make_choice或.fn.tagit中包含的任何函数

#1


2  

I've created a working example at http://jsfiddle.net/nickywaites/DnkBt/ but it does require making changes to the plugin.

我在http://jsfiddle.net/nickywaites/DnkBt/上创建了一个工作示例,但确实需要对插件进行更改。

#2


0  

Change

更改

$.fn.tagit = function(options) { ...

to

$.fn.tagit = function(options,callback) { ...

Add

if (callback && typeof callback == 'function') {
    callback();
}

after

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

Now you can call a function of your choice right after the tagit call:

现在,您可以在tagit调用后立即调用您选择的函数:

$tagit = $("#mytags").tagit(yourOptions, function(){
    alert('hi')!
});

#3


0  

You can try to add

你可以尝试添加

return this;

right after the function create_choice block. tagit will return itself and you can call make_choice or any function contained in .fn.tagit

在create_choice函数块之后。 tagit将自行返回,您可以调用make_choice或.fn.tagit中包含的任何函数