在执行 space 之后将文本框内容放在 span 或 li 上

Question

有没有一种简单的方法可以执行类似 stackoverflow 中问题区域底部的标签编辑器之类的操作。
我需要一个字符串列表。因此，我计划创建一个文本框，按下空格键，内容将被推送到 span 或 li 标签中，并且文本框被清空并准备好输入要推送的新内容。

Answer 1

此处演示

HTML

<div id="container">
    <input type="text" id="tags"/>
</div>    

CSS

#container{
border: 1px solid #FF7800;
padding:10px 0 10px 5px;
}

#tags{
 border:none;
}
.mytag{
background:#FF7800;
color:#fff;
padding:5px;
margin-right:5px;    
}

jQuery

$("#tags").keyup(function(event) {
  //alert(event.keyCode);
    if(event.keyCode=='32'){
        var tagname= $(this).val();
        if(tagname!=" "){
            var newtag= $("<span class='mytag'>"+tagname+"</span>");
            $(this).before(newtag);
        }
        $(this).val("");
    }
});

演示在这里 我希望你想要这种行为