tagit:改变标签的值

tagit: change the value of label

我正在使用此 jquery ui 插件 https://github.com/aehlke/tag-it 进行标记。

我这样创建标签

$("#Input").tagit("createTag", "ABC");

我想要的是根据值向标签添加一些文本。例如:

ABC-普通

DEF-成员

 beforeTagAdded: function (event, ui) {
     var label = $('#Input').tagit('tagLabel', ui.tag);
     if (label == "ABC") {
        ...                   
     } else {

     }
 },

这是一个使用 preprocessTag

的演示

$('#Input').tagit({
  preprocessTag: function(val) {
    if (!val) {
      return '';
    } else if (val == 'ABC') {
      return 'ABC - Normal';
    } else if (val == 'DEF') {
      return 'DEF - Member';
    } else {
      return val;
    }
  }
});

$('#Input').tagit('createTag', 'ABC');
$('#Input').tagit('createTag', 'DEF');
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="https://cdn.jsdelivr.net/gh/aehlke/tag-it/js/tag-it.min.js" type="text/javascript" charset="utf-8"></script>

<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/flick/jquery-ui.css">
<link href="https://cdn.jsdelivr.net/gh/aehlke/tag-it/css/jquery.tagit.css" rel="stylesheet" type="text/css">
<link href="https://cdn.jsdelivr.net/gh/aehlke/tag-it/css/tagit.ui-zendesk.css" rel="stylesheet" type="text/css">


<ul id="Input">
  <li>Tag2</li>
</ul>