Javascript 如何在Textarea中输入的每个单词的空格后创建具有可能取消选择的边界框？

我想提供这样的功能，一个人可以使用HTML/JQuery/Javascript将一个单词输入文本区域（如果不能，则不必是文本区域），然后按下空格键，该单词将被绑定并在旁边显示一个“x”，以便可以删除它

像这样：

抱歉，我不知道如何称呼这种元素/控件

---

非常感谢您的帮助

类似这样的东西

html

jquery

function closer(){
    $('#box a').on('click', function() {
       $(this).parent().parent().remove(); 
    });
}
$('#type').keypress(function(e) {
    if(e.which == 13) {//change to 32 for spacebar instead of enter
        var tx = $(this).val();
        if (tx) {
            $(this).val('').parent().before('<li><span>'+tx+'<a href="javascript:void(0);">x</a></span></li>');
            closer();
        }
    }
});

函数closer（）{
$（#框a'）。在（'单击'，函数（）上）{
$（this.parent（）.parent（）.remove（）；
});
}
$（'#type'）。按键（功能（e）{
如果（e.which==13）{//将空格键改为32，而不是enter
var tx=$（this.val（）；
中频（tx）{
$（this.val（''）.parent（）在（'
'+tx+'
'）之前；
closer（）；
}
}
});

当按下enter键时，这会增加，因此它的工作方式类似于

指环王

，而不是

指环王

的

。如果希望空格键触发，请将
e.which==13
更改为
e.which==32

它仍然需要css的改变，使它看起来像你想要的，这只是一个例子，它是如何工作的

胡闹：
我相信这就是你想要的：谢谢你的链接！我最终使用了Select2 Find Hi，这很有效，但我最终使用了Select2 Find
function closer(){
    $('#box a').on('click', function() {
       $(this).parent().parent().remove(); 
    });
}
$('#type').keypress(function(e) {
    if(e.which == 13) {//change to 32 for spacebar instead of enter
        var tx = $(this).val();
        if (tx) {
            $(this).val('').parent().before('<li><span>'+tx+'<a href="javascript:void(0);">x</a></span></li>');
            closer();
        }
    }
});