tagit:更改标签的值

时间:2019-06-29 08:59:08

标签: javascript jquery tags tag-it

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

     }
 },

1 个答案:

答案 0 :(得分:0)

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