如何为动态添加的跨度元素分配点击事件

How to assign click event for dynamically added span element?

本文关键字：分配 元素 事件 动态 添加      更新时间：2023-09-26

html:

<div class="testSpanDiv"></div>

javascript:

  $(document).ready(function () {
      $('.testSpanDiv').append('<span id="testSpan">Hello</span>');
  }
  $('#testSpan').on('click', function(){
      $(this).parent().remove();
  });

当单击动态添加的跨度元素时，事件未激发。如果将span元素静态添加到html中，则会触发事件。你能对此提出什么建议吗？

我也试过了，但没有成功。

  $('#testSpan').on('click', '.testSpanDiv', function(){
      $(this).parent().remove();
  });

您需要这样使用：

$('.testSpanDiv'(.on('click'，'#testSpan'，function(({//要在其中绑定函数的^^父div ^^元素$(this(.Pparent((.remove((；})；

您的语法错误尝试这种方式

$(document).ready(function () {
      $('.testSpanDiv').append('<span id="testSpan">Hello</span>');

   $('#testSpan').on('click', function(){
      $(this).parent().remove();
  });
  });

https://jsfiddle.net/7x8jbLpt/

您可以从body 委派事件

还要注意，在你的代码中有一些语法错误

 $(document).ready(function () {
      $('.testSpanDiv').append('<span id="testSpan">Hello</span>');
  })
  $('body').on('click', '#testSpan', function(){
      alert("Hello")
  });

JSFIDDLE

相关文章：