jQuery UI Accordion内动态新增元素的+按钮点击无响应问题

• 事件绑定逻辑缺陷：你当前使用的$("#addinvt").on("click", ...)属于直接事件绑定，仅会给绑定代码执行时已经存在于DOM中的元素挂载事件。后续动态生成的+按钮是在绑定逻辑执行完成后才插入DOM的，不会被自动绑定点击事件，因此点击无响应。
• 重复ID违规：HTML规范要求DOM中ID必须全局唯一，你动态生成的元素复用了addinvt、reminvt、extname等ID，会导致选择器匹配异常，属于潜在故障点。

采用事件委托机制解决动态元素的事件绑定问题，同时修正重复ID问题即可：

1. 调整事件绑定逻辑，将事件委托到页面中始终存在、不会被动态删除的父容器（这里选择.invitediv），委托所有class为addinvt的按钮触发点击事件，修改后的代码如下：

$(".invitediv").on("click", ".addinvt", function (e) {
  e.preventDefault();
  var data =
    '</br> <div class="form-row  invitepeople" >' +
    '  <div class="col-3">' +
    ' <input type="text" class="form-control inmail" placeholder="Email" />' +
    " </div>" +
    '<div class="col-3">' +
    ' <input type="text" class="form-control inname extname" placeholder="Name" />' +
    " </div>" +
    '<div class="col-3">' +
    '<input type="text" class="form-control incnt" placeholder="Mobile No" />' +
    "</div>" +
    '<div class="col-1">' +
    ' <input type="button" onclick="removeDiv(this);" class="btn btn-danger reminvt" value="-" />' +
    "</div>" +
    '<div class="col-1">' +
    '<input type="button" class="btn btn-success addinvt" value="+" />' +
    "</div>" +
    "</div>";
  $(".invitediv").append(data);
});

2. 修正初始HTML中的重复ID：将初始DOM中addinvt、reminvt、extname的ID属性删除，仅保留class属性即可，例如初始的+按钮修改为<input type="button" class="btn btn-success addinvt" value="+" />。

事件委托的核心逻辑是将事件挂载到父容器上，利用事件冒泡机制捕获子元素的触发行为，只要子元素匹配指定的选择器就会触发对应逻辑，不管子元素是初始存在还是后续动态插入的都可以正常生效。

内容的提问来源于stack exchange，提问作者Ashwin