JQuery Tag It - 编辑标签内联

Question

我使用了jQuery tagit来接受电子邮件地址。我已经验证了电子邮件格式的标签。我想知道它是否也可以编辑标签，如果用户输入错误的内容。目前，如果出现问题，我们必须删除标签并重新输入。

提前感谢您。

 $("#singleFieldTags").tagit({
        singleField: true,
        singleFieldNode: $('#mySingleField'),
        beforeTagAdded: function (event, ui) {
            //email validation code
        }
    });


    <ul id="singleFieldTags"></ul>
     <input id="mySingleField" />

- Roshni Shah

---

我认为它没有编辑功能。 - rajesh kakawat

请检查此链接：http://tagedit.webwork-albrecht.de/ - rajesh kakawat

Answer 1

GitHub上发布了一个解决方案，具有此功能。

这里有一个工作的fiddle，允许您编辑标记。

基本上，您需要使用onTagClicked参数并为其提供自定义函数：

 onTagClicked: function(event, ui) {
                var elem = $(ui.tag);
                var input = $('<input type="text" id="replaceInput" value="'+ ui.tagLabel + '" />');
                temp = ui.tagLabel;
                input.bind('blur',function(){
                    var instance = $("#mySingleField").data("tagit");
                    $(this).closest('.tagit-label').empty().append($(this).val());
                    var oldValue = temp;
                    var tags = instance.assignedTags();

                    for(var i = 0;i < tags.length;i++){
                        if (tags[i] === oldValue){
                            tags[i] = $(this).val();
                        }
                    }
                    instance._updateSingleTagsField(tags);
                });                 
                elem.find('.tagit-label').empty().append(input);
                input.focus();
            }

现在，当您单击标签时，您将会看到您可以编辑它。

- maxshuty