jq对动态生成的节点绑定事件

jq对动态生成的节点绑定事件

• 介绍：当我们在jsp页面中点击“+”按钮生成一个新的卡号文本框，每个文本框后面有一个“-”可以进行删除当前卡号的行，所以这个生成的卡号行都是js动态生成，对应的删除行事件不能嵌套onclick事件，只能用on事件进行动态绑定

    //点击add-card插入新的元素
    $(".add-card").click(function () {
            var newHtml = '';
            newHtml += '<div class="inputItem">';
            newHtml += '<input type="text" name="" class="cardNum" style="margin-left: 88px;" placeholder="请输入卡号">';
            newHtml += '<div class="del-card">-</div>'; /*onclick="deleteCardItem();"这种写法不生效*/
            newHtml += '</div>';
            $(this).parent().after(newHtml);
       });
  
    //点击del-card时通过其父节点addPopuForm绑定点击事件传到子节点进行删除操作
     $("#addPopuForm").on("click", '.del-card', function () {
         $(this).parent().remove();
     });
  

$("#addPopuForm")对应卡号文本框的外层容器