Question

当我单击按钮时，将元素附加到主体上，并且当我单击附加按钮（隐藏按钮）时不起作用。效果不佳。请解决此问题。

function func_add(){
  $('body').append('<div class="test"><button id="hide-btn">hide</button><div id="red"></div></div>');
}

$('#btn').click(function(){
  func_add();
});

$('#hide-btn').click(function(){
 $('#red').hide();
});

#red{
  background:red;
  width:100px;
  height:100px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<body>
  <button id="btn">click me</button>
</body>
</html>

Answer 1

这是因为添加点击事件监听器时$('#hide-btn')不存在。您应该在添加按钮后添加点击监听器，或使用以下方法：

$('body').on('click', '#hide-btn', function () {
    $('#red').hide();
});

在追加元素之后，按钮无法正常工作

1 个答案: