创建输入表单以添加/删除关键字

Question

我正在尝试制作类似于 stackoverflow 中添加关键字的内容。

我只是被 HTML 部分或 javascript 困住了？

当找到并点击关键字时，如何将其固定在输入字段中？就像在 stackoverflow 中一样，它变成蓝色，旁边有一个删除按钮。

目前，结果显示<input>在新的<div>.

<fieldset>
    <label for="title">Add keyword<label>
    <input class="input" type="text" size="30" onkeyup="searchFunction()" onkeydown="searchFunction()">
</fieldset>

<div id="livesearch"></div>

Answer 1

它不是一个真正的<input>元素。它只是看起来像输入。您应该使用常规<div>并附加（例如）风格化<span>它。

尝试这个 jQuery 插件https://github.com/xoxco/jQuery-Tags-Input。您可以使用 jQuery.autocomplete。

我在生产中使用这个插件，没问题。