Question

我已经创建了一个添加新字段的按钮，并且我要添加的字段是按钮上的tagit字段，单击该数据时，数据分配得很好，但是tagit功能不起作用，它添加为空白ul。我不知道为什么不将ul转换为tagit字段。有没有办法动态添加tagit字段？

我在Google上进行了很多搜索，但未找到任何内容。

var i = 1;
$('.tagWritting').each(function() {
  $(this).tagit({
    options: {
      fieldName: 'test_name' + i,
    }
  });
  i++;
});
$('.addField').on('click', function() {
  $('.tags').append('<ul class="tagWritting"></ul>');
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://rawgit.com/aehlke/tag-it/master/js/tag-it.js"></script>
<link href="http://aehlke.github.io/tag-it/css/jquery.tagit.css"rel="stylesheet" />
<a class="addField">Add New Field</a>
<div class="tags">
  <ul class="tagWritting"></ul>
  <ul class="tagWritting"></ul>
  <ul class="tagWritting"></ul>
</div>

Answer 1

问题是标记已创建，附加，并且您没有在此新元素上运行$().tagit()

此部分：

$('.tagWritting').each(function() {...});

每个标签附加后需要之后运行

或，在添加标签后，您可以选择最后一个标签并执行以下操作：

$(tagElement).tagit({...});

类似的东西：

var i = 0;
function addTagit(element){
  $(element).tagit({
    options: {
      fieldName: 'test_name' + i,
    }
  });
  i++;
}

$('.tagWritting').each(function(){
  addTagit(this);
});

$('.addField').on('click', function() {
  var tag = $('<ul class="tagWritting"></ul>');
  $('.tags').append(tag);
  addTagit(tag);
});

我没有测试代码，并且多年没有使用jQuery ...但是我认为它可以为您提供帮助

我正在尝试动态添加多个tagit字段，但对我不起作用

1 个答案: