Я пытаюсь динамически добавить несколько полей tagit, но у меня это не работает

#javascript #jquery #html #jquery-ui #tag-it

#javascript #jquery #HTML #jquery-пользовательский интерфейс #tag-it

Вопрос:

Я создал кнопку для добавления новых полей, и поле, которое я хочу добавить, является полем 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>  

Комментарии:

1. Не могли бы вы, пожалуйста, отредактировать свой вопрос и добавить знаки препинания? В настоящее время чтение раздражает. Если вы хотите, чтобы другие помогли вам, по крайней мере, уделите некоторое время правильному написанию.

2. chekc теперь я надеюсь, что это не вызывает раздражения

3. Единственное, что вы сделали, это удалили единственный период, который там был……………

4. извините, что не понял вас

5. У вас была одна точка в вашем очень длинном абзаце слов, вы удалили ее, но вам не следовало ее удалять, вам следовало добавить больше точек и больше запятых, потому что в противном случае без какой-либо пунктуации такие сверхдлинные предложения, как это, очень раздражают при чтении, и если вы хотите, чтобы люди помогли вам, вам следует потратить некоторое время на составление вопросов и предложений для чтения, потому что в противном случае это слишком долго и слишком болезненно для чтения и понимания, никто не ответит на ваш вопрос посмотрите на другие вопросы на этом сайте и на других сайтах и потратьте некоторое время пожалуйста, пишите правильно

Ответ №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 годами… но я думаю, что это может вам помочь

Комментарии:

1. Я пытался добавить вот так append (‘<script>$(tagElement). tagit({…});</scipt>’) но javascript игнорирует последнюю точку

2. да, пожалуйста, я верю, что таким образом это сработает, потому что javascript загрузится, и он добавит и запустит javascript, я думал о том же, но, согласно вашей идее, это создавало мне проблему </script>