jQuery / 标签输入 - Select 元素的内容

jQuery / Tags Input - Select element by its content

如果你能帮我解决我的问题,我将不胜感激。我有 20-30 个这样的元素:

<div class="file file-unchosen">
  <div class="file-name-title">
    "File-title"
  </div>
</div>

其中 .file 用于 css-块的样式

我有 bootstrap tags input list 可以存储所选文件的功能:

$('.file').click(function() {
  $(this).toggleClass('file-unchosen file-chosen');
  function addWork(elem) {
    var workname = $(elem).find('.file-name-title').text();
    $('#chosen-works-list').tagsinput('add', workname);
  };
  addWork(this);
});

问题是,当我从标签输入列表中删除 .file 时,我无法理解如何使它不再被选中。现在我正处于这样的事情中间(无论如何都不起作用):

$('#chosen-works-list').on('itemRemoved', function(event) { //when tag is removed from tags list
  var chosenWorks = [];
  $('.file-chosen').each(function(i,elem) { //we take all of the chosen files
  console.log(elem); //log them
  chosenWorks.push($(elem).find('.file-name-title').text().toString());
                }); //push them to array
  var delWork = event.item; //define deleting tag
  ...and I don't know what to do next..
 });

理论上,下一步必须检查 $(.file-chosen .file-name).text() 是否等于 $(delWork) 并切换其 class,但无法弄清楚如何做到这一点。

试试这个:

<div class="file file-unchosen" data-content="deleted-tag-content">

然后这样操作:

$('.file[data-content="'+ delWork +'"]').toggleClass('file-unchosen file-chosen');

不要犹豫使用数据属性,并通过它们进行查询。