Question

我正在为我的一个项目使用tagsinput，有一个小问题卡住了。希望我在这里找到一些好的答案。我面临的问题是给每个标签涂上不同的颜色。请仔细阅读以下我已经解释过的信息。

以下是为不同标签赋予不同颜色的代码：

      $('.myinput').tagsinput({
          tagClass: function(item) {
            switch (item.continent) {
              case 'Europe'   : return 'label label-info';
              case 'America'  : return 'label label-success';
              case 'Australia': return 'label label-danger label-important';
              case 'Africa'   : return 'badge badge-inverse';
              case 'Asia'     : return 'badge badge-warning';
              case 'Asia2'     : return 'badge badge-error';
              case 'Africa2'   : return 'label label-default';
            }
          },
          itemValue: 'value',
          itemText: 'text',
          source: function(query) {
            return $.getJSON('cities.json');
          }
        });

我有一个按钮，单击按钮会打开一个模式框。通过模式框，我确实选择了一些单词并将其动态添加到作为值输入的标签中。提交该模式形式后，我会随机选择颜色并将其分配给要在输入中设置的标签作为值。正如您从下面的代码中看到的那样。

      $('#modelformbuttonclick').click(function() {
          var tableRowId =  $('#myModal').data('current');
          var textArray = ['song1.ogg','song2.ogg'];
          //Generating random number input for color selection
          var randomNumber = Math.floor(Math.random()*textArray.length);
          c = '#' + tableRowId;
          //removing all tags if anyone updates tags
          $(c+ ' input.myinput').tagsinput('removeAll');
          var count=1; var color = ["Europe","America","Australia","Africa","Asia", "Asia2", "Africa2"];

          $('.modal-body-inner span.myclass').each(function() {
              c = '#' + tableRowId;
              var randomNumber = Math.floor(Math.random()*color.length);
              $(c + '  input.myinput').tagsinput('add', {"id": $(this).text(), "name": "tagsdata", "value": $(this).text() , "text": $(this).text(), "continent": color[randomNumber]});
              count = count+1;
          });

现在上面的代码可以正常工作了。不同的颜色分配给不同的标签。现在，如果要加载这样的现有标签：

      <input contenteditable="false" name="unique_tag" value= "{{ d|get_item:"unique_tag" }}" 
          class = "myinput" id="tagsinputid" data-role="tagsinput" />

这段代码{{d | get_item：“ unique_tag”}}给了我一些选定的词，例如'word1，word2，word3'。

所以现在我面临的问题是，在动态添加新标签时，我能够将不同的颜色应用于不同的标签，但是我该如何如上面的代码中所述，为正在加载的现有标签分配不同的颜色。

是否有这样的方法，我一个接一个地获取值，然后为它们分配不同的颜色？或任何非常能做到这一点的属性或方法

我希望我能在这里找到答案。谢谢

如何使用标签将不同的颜色分配给不同的标签

0 个答案: