Bootstrap 4 TagsInput maxNumTags 不工作

Question

我想在我的输入字段中设置最多 5 个标签，但 maxNumTags:5 在 jquery 中不起作用我应该如何设置 tagsInput 的最大值？

HTML

<input
  type="text"
  class="form-control"
  id="tags"
  name="tags"
  value="{{ old('tags') }}"
  data-role="tagsinput"
/>

这是脚本

<script src="dashboard-assets/js/tagsinput.js"></script>
<script>
  $("#tags").tags({
    maxNumTags: 5
  });
</script>

Answer 1

使用maxTags设置输入标签的最大数量。您还可以使用 allowDuplicates: true 允许在同一输入中使用重复标签。

工作演示：http://jsfiddle.net/usmanmunir/gh7cy2vf/

运行下面的代码片段可以看到它的工作原理。

$(document).ready(function() {
  $('.tags').tagsinput({
    maxTags: 5,
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.js" integrity="sha512-VvWznBcyBJK71YKEKDMpZ0pCVxjNuKwApp4zLF3ul+CiflQi6aIJR+aZCP/qWsoFBA28avL5T5HA+RE+zrGQYg==" crossorigin="anonymous"></script>

Type Here: <input type="text"
  class="form-control tags"
  id="tags"
  name="tags" placeholder="Add tags here">

Bootstrap 4 TagsInput maxNumTags 不工作

Bootstrap 4 TagsInput maxNumTags is not working

html

javascript

bootstrap-tags-input

bootstrap-4