Question

我正在关注以下链接bootstrap3-tutorial中的教程。现在在该链接中有一个例子如下，

HTML code，

<input type="text" value="Amsterdam,Washington,Sydney,Beijing,Cairo" data-role="tagsinput" />

jQuery代码，

$('input').tagsinput({
  typeahead: {
    source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo']
  }
});

当我输入“S”时，我希望得到“悉尼”的建议，但问题是我没有得到任何建议。以下是我正在导入的文件

<link href="bootstrap3.min.css" rel="stylesheet">
        <link href="typeaheadjs.css" rel="stylesheet">    
    <script src="jquery.js"></script>
    <script src="bootstrap3.min.js"></script>
    <script src="typeahead.js"></script>

那么为什么我没有得到任何建议呢？您还可以通过其他方式向我建议，以便为生成引导标记生成建议。

Answer 1

您应该删除data-role="tagsinput"，因为您是直接调用插件。

另外，向input添加ID。

所以你应该成为：

<input type="text" id="id1" value="Amsterdam,Washington,Sydney,Beijing,Cairo" />

并且使用应该将你的jquery改为：

$(function () {
    $('#id1').tagsinput({
        typeahead: {
            source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo']
        }
    });
});

这应该有用。

Bootstrap 3 typeahead不使用bootstrap标签

1 个答案: