如何在搜索框中向文本添加标签

Question

我正在一个工作列表项目中，该项目根据选定的国家来获取工作，现在我试图创建一个搜索框，将我的文本更改为标签，就像StackOverflow添加标签的方式一样。我已经有了figma设计，但是实现是问题所在。

这是figma链接：https://www.figma.com/proto/UE9D4alg1970WXIDnLAfVzHz/listing-by-country?node-id=96%3A0&scaling=min-zoom

<div class="input-group input-group-search">
   <input id="search-text" value="" type="search" class="form-control" placeholder="Enter Job listing according to Countries">
   <div class="input-group-btn">
      <button class="btn btn-primary ml-2" id="search-submit" type="submit">Search</button>
   </div>
</div>

我希望搜索结果在搜索框之后或内部立即生成标签。预先感谢

Answer 1

您可以使用类似：https://github.com/yairEO/tagify

甚至：

https://selectize.github.io/selectize.js/

Google是您的朋友。