我们如何使用Jquery tagit获取所选标签的ID？

我有一个输入标记字段，我想获取所选择的tages的ID所以我尝试了http://jsfiddle.net/u8zj5/19/但我的问题我想得到的id不是标签或值传递到id="show"但我失败了。

  show ID here 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("
"+currenttags+"
"); 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'] }); }); 

}）;

这里使用jQuery Tagit（演示页面）的任何人都可以帮我解决这个问题

Answer 1

我有同样的问题，我做了什么修改tag-it.js。 当您调用函数select时，您需要通过函数_addTag发送ID

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

然后你只需要获取id：

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

并在此处将ID附加到隐藏的选择上

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

使用此function，您可以拥有一个自动完成列表标签，一个要在标签中显示的值，以及一个隐藏选择的ID 。

Answer 2

我有同样的问题，但不想改变插件的默认行为。 所以，相反，我使用提供的钩子来添加新的行为。

 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; }); } } }); 

Answer 3

使用其他一些插件，如Select2。 它实际上得到了支持。