单击按钮删除

时间:2014-07-03 13:41:21

标签: javascript jquery tags

我有一个部分,用户可以通过输入文本和单击添加按钮来添加标签。添加标记后,它会显示删除按钮,以便用户可以添加或删除标记。我创建了JavaScript代码,允许用户添加以下工作的标记。但是,我不知道如何在用户点击删除按钮时删除标签。任何帮助将不胜感激。

if($("#addTag").length>0){

    $("#addTag").click(function(){

        var tag = $("#tag").val()
        var campaign_tags =  JSON.parse($("#campaign_tags").val())

        if(tag==''){
            alert('no text added')
        }
        else{
            //add check to see if the tag is already added
            if(jQuery.inArray(tag, campaign_tags)==-1)
            {

              var tag_html = "<div class='campaign_tags'><small>"+tag+"</small><div class='campaign_btn remove_tag'>x</div></div>"

              $("#tag_container").append(tag_html)

              //now add the tag to the array
              campaign_tags.push(tag)
              $("#campaign_tags").val(JSON.stringify(campaign_tags))

              //re-initialize the delete function
              init_remove_tag()

            }


        }   
    })  
}   

1 个答案:

答案 0 :(得分:1)

单击删除按钮时将调用以下代码。它会找到campaign_tags div并将其删除。

$(document).on("click", ".remove_tag", function(){
    $(this).parents(".campaign_tags").remove();
});

修改

@Blazemonger建议.closest()是更好的选择

$(document).on("click", ".remove_tag",function(){
    $(this).closest(".campaign_tags").remove();
});