Блог

У меня есть раздел, в котором пользователь может добавлять теги, вводя текст и нажимая кнопку добавить. Как только тег добавлен, он отображается с кнопкой удаления, чтобы пользователь мог добавлять или удалять теги. Я создал код 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()

            }


        }   
    })  
}   
  

Приведенный ниже код будет вызван при нажатии на вашу кнопку удаления. Он найдет 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();
});