向标记添加X删除按钮

Question

我在这个＆＃34; http://jsfiddle.net/6xpoeth6/1/＆＃34;上找到了这个How to create a non-editable type(like tags) when a button is pressed脚本。页。任何人都可以添加一个X按钮来移除帖子，就像这个＆＃34; http://timschlechter.github.io/bootstrap-tagsinput/examples/＆＃34;插件或类似于此网站上的标签输入？

以下是代码：

HTML

<input class="btn btn-info attribute-button" name="commit" type="button" value="first_name" />
<input class="btn btn-info attribute-button" name="commit" type="button" value="second_name" />

<div class="tags">
    <input type="text" name="newtag" class="newtag" placeholder="Add tags" />
</div>

CSS

.tags{
    width: 400px;
    height: 100px;
    border: 1px solid #000;
    margin: 5px;
}
.tag{
    padding: 1px;
    background-color: blue;
    color: #fff;
    border-radius: 3px;
    display: inline-block;
}
.newtag{
    border: none;
    outline: none !important;
}

JS

$(document).ready(function(){
    $(".tags, .attribute-button").click(function(){
        $(".newtag").focus();
    })
    $(".newtag").keydown(function(e){
        if(e.which === 13 || e.which === 32 || e.which === 9){
            e.preventDefault();
            $(".newtag").before("<div class='tag'>"+$(".newtag").val()+"</div>");
            $(".newtag").val("");
        }
    });
    $(".attribute-button").click(function(){
        $(".newtag").before("<div class='tag'>"+$(this).val()+"</div>");
    })
});

由于