Jquery ui 如何使用Jquery tagit获取所选标记的ID？

我有一个输入标记字段，我想获得所选标记的ID 所以我试过了，但我的问题是我想要的是id而不是标签 或传递到

id=“show”

的值，但我失败了

<input type="text" id="field1" name="field1" value=""/>
<span id="show">show ID here</span>

jQuery(document).ready(function(){
var availableTags = [{"id":"144","label":"Allicelabel","value":"Allice value"}];
jQuery("input#field1").each(function(){
    var target = jQuery(this);
    var currenttags = target.val();
    target.hide()        
          .after("<ul class=\"tags\"><li>"+currenttags+"</li></ul>");
    var instance = target.next();
    instance.tagit({
        tagSource:availableTags,
        tagsChanged:function () {
            var tags = instance.tagit('tags');
            var tagString = [];
            for (var i in tags){
                tagString.push(tags[i].value);
            }
            $("#show").html(tagString.join(','));
        },
        sortable:true,
        triggerKeys: ['enter', 'comma', 'tab']
    });
});

在这里显示ID
jQuery（文档）.ready（函数（）{
var availableTags=[{“id”：“144”，“label”：“Allicelabel”，“value”：“Allice value”}]；
jQuery（“输入#字段1”）。每个（函数（）{
var target=jQuery（this）；
var currenttags=target.val（）；
target.hide（）
.在（“
“+currenttags+”
”）之后；
var instance=target.next（）；
instance.tagit({
标记来源：可用标记，
tagsChanged:function（）{
var tags=instance.tagit（'tags'）；
var tagString=[]；
for（标签中的变量i）{
tagString.push（标记[i].value）；
}
$（“#show”）.html（tagString.join（'，'）；
},
可排序：是的，
触发器键：[“输入”、“逗号”、“制表符”]
});
});

}))

---

这里的任何人都可以帮助我解决这个问题，我也有同样的问题，我所做的就是修改tag-it.js。 调用函数时，选择需要通过函数

\u addTag

发送

ID

self._addTag(ui.item.label, ui.item.value, ui.item.id);

那么你只需要得到身份证：

_addTag: function(label, value, id) {
    ...
    this._addSelect(label, value, id);
    ...
}

这里将

ID

附加到一个隐藏的Select上

_addSelect: function(label, value, id) {
        var opt = $('<option>').attr({
            'selected':'selected',
            'value':id
        }).text(label);
        this.select.append(opt);

\u addSelect:函数（标签、值、id）{
变量opt=$（''）.attr({
'选定'：'选定'，
“值”：id
}).文字（标签）；
this.select.append（opt）；

---

有了它，你就可以拥有一个用于自动完成列表的标签，一个用于在标记中显示的值，以及隐藏选择上的

ID

。

我也有同样的问题，但不想改变插件的默认行为。因此，我使用提供的挂钩添加新的行为

var availableTags = [
    {
        label: "myTag",
        value: "myTag",
        id: 1
    },
    //etc...
];
var assignedTags = [];


$('#singleinputfield').tagit( {
                            tagSource: function (request, response) {
                                    //setup the search to search the label
                                    var matcher = new RegExp($.ui.autocomplete.escapeRegex(request.term), "i");
                                    response($.grep(availableTags, function (value) {
                                        return matcher.test(value.label);
                                    }));
                            },
                            beforeTagAdded: function(event, ui){
//get id for that tag and signal if it was in the tagSource list
                                var id, result = false;
                                $.each(availableTags, function(){
                                    if(ui.tagLabel === this.label){
                                        result = true;
                                        id=this.id;
                                        return false;
                                    }
                                });
                                if(result){
//put id in the list of ids we are using
                                    assignedTags.push(id);
                                }
                                return result;
                            },
                            afterTagAdded: function(event, ui){
//replace the values in the single input field with the assigned ids
                                    $('#singleinputfield').val(assignedTags.join(','));
                            },
                            afterTagRemoved: function(event, ui){
                                $('#singleinputfield').val(assignedTags.join(','));
                            },
                            beforeTagRemoved: function(event, ui){
                                var id;
//get the id for the removed tag and signal if it was in the tagSource list
                                $.each(availableTags, function(){
                                    if(ui.tagLabel === this.label){
                                        result = true;
                                        id = this.id;
                                        return false;
                                    }
                                });
                                if(result){
//remove the unassigned tag's id from our list
                                    assignedTags = $.grep(assignedTags, function(el){
                                        return el != id;
                                    });
                                }
                            }
                        });

---

使用其他插件，比如Select2。它实际上已经得到了支持