字体很棒的按钮，当我点击字体时它不起作用

When I click on the 'x' it does not work, it only works when I click outside (id #close has a padding of 3px). I tried by assigning #id to the i tag,it does no even triggered an event. What can I do so that anything that is inside the #id close when click event will fired.

当我点击'x'时它不起作用,它只在我点击外面时才有效(id #close的填充为3px)。我尝试将#id分配给i标签,它甚至没有触发事件。我可以做什么,以便在点击事件时#id关闭内的任何内容都会被触发。

html

 <span id="close"><i class="fa fa-times-circle"></i></span>

 $('#close').click(function(event){
        if(event.target.id=='close'){
            $(this).parent().parent().remove();
            $(this).remove();
       }
  });

2 个解决方案

#1

Your code isn't working as expected because event.target.id is not close every time. Here's a JSFiddle to illustrate the problem.

您的代码未按预期工作,因为event.target.id并非每次都关闭。这是一个JSFiddle来说明问题。

What you want to do is simply handle the click event on #close. Note that $(this) is always the current selector:

你想要做的只是处理#close上的click事件。请注意$(this)始终是当前选择器:

$("#close").click(function(event) {
    var $topParent = $(this).parent().parent();

    $(this).remove();
    $topParent.remove();
});

#2

Why using this condition?

为什么使用这个条件?

 if(event.target.id=='close')

I created this JSFiddle and it works: JSFiddle

我创建了这个JSFiddle并且它可以工作:JSFiddle

#1