tagit：更改标签的值答案

【问题标题】：tagit: change the value of labeltagit：更改标签的值
【发布时间】：2019-06-29 08:59:08
【问题描述】：

我正在使用这个 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 {

     }
 },

【问题讨论】：

标签： javascript jquery tags tag-it

【解决方案1】：

这是一个使用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>

【讨论】：