Question

我使用.append()在div中添加了一个类，但是当我点击类（.again）时，没有任何反应（当我点击你好吗？ < em>很好！应该显示）。你有什么想法吗？

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="src">
  <p class="feedback">Welcome !</p>
</div>

<script>
$('.feedback').click( function() {
  $('.feedback').html( 'Thank You ! Do not click here ;) click on How are you below');
  $('#src').append('<p class="again">How are you ?</p>');
});

$('.again').click( function() {
  $('.again').html( 'Fine !');
});

</script>

＆＃13;

Answer 1

它无法正常工作，因为您在使用该类创建元素之前，再次附加“再次”类的事件单击。

$（'。again'）返回当时文档中包含该类的所有元素。

为了做你需要的事情，你应该在创建元素后在类上附加事件。像这样：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="src">
  <p class="feedback">Welcome !</p>
</div>

<script>
$('.feedback').click( function() {
  $('.feedback').html( 'Thank You ! Do not click here ;) click on How are you below');
  $('#src').append('<p class="again">How are you ?</p>');

  $('.again').click( function() {
    $('.again').html( 'Fine !');
   });
});

</script>

Answer 2

添加旧处理函数未绑定的新元素。

＆＃13;

 $('.feedback').click( function() {
  $('.feedback').html( 'Thank You ! Do not click here ;) click on How are you below');
  $('#src').append('<p class="again">How are you ?</p>').click( function(){  $('.again').html( 'Fine !')});;
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>


<div id="src">
  <p class="feedback">Welcome !</p>
</div>

＆＃13;

jQuery在div中附加一个类不起作用

2 个答案: