jQuery删除新元素

时间:2013-08-10 20:30:40

标签: jquery html

我有一个HTML表单,允许用户在表单中添加更多元素,但是在每行元素的一侧,有一个'删除'按钮,此按钮链接到jQuery调用,但单击按钮时新添加的元素不会被删除,但是,最初硬编码到HTML中的元素将被删除。

这是我的代码:

$("[data-action]").each(function(i,a){
$(a).bind('click',function(){
    switch ($(a).attr("data-action")) {
        case "AddQualificationField":
            qual_add_current++;
            var qual_add_html = '<div id="AddQualification' + qual_add_current + '" class="controls inline" style="margin-top: 5px;">' +
                        '<label for="AddQualificationType[' + qual_add_current + ']">Type:</label> <input type="text" name="AddQualificationType[' + qual_add_current + ']" id="AddQualificationType[' + qual_add_current + ']" placeholder="e.g. \'A\' Level" class="input-small" maxlength="75" /> ' +
                        '<label for="AddQualificationSubject[' + qual_add_current + ']">Subject:</label> <input type="text" name="AddQualificationSubject[' + qual_add_current + ']" id="AddQualificationSubject[' + qual_add_current + ']" class="input-small" maxlength="75" /> ' +
                        '<label for="AddQualificationGrade[' + qual_add_current + ']">Grade:</label> <input type="text" name="AddQualificationGrade[' + qual_add_current + ']" id="AddQualificationGrade[' + qual_add_current + ']" class="input-small" maxlength="20" /> ' +
                        '<button type="button" class="btn" data-action="RemoveQual" data-qualid="' + qual_add_current + '"><i class="icon-remove"></i></button>' +
                    '</div>';
            $("fieldset#AddQualifications").append(qual_add_html);
            break;

        case "RemoveQual":
            var qual_id = parseInt($(a).attr("data-qualid"));
            if (confirm("Are you sure that you want to do this?")) {
                $("div#AddQualification" + qual_id).remove();
            }
            break;
    }
  });
});

3 个答案:

答案 0 :(得分:0)

您必须使用Jquery On方法删除动态创建的元素。

答案 1 :(得分:0)

您需要重新绑定动态添加到DOM树的元素。第一个 bind()调用仅绑定文档中当前的元素。之后添加的元素不予考虑。

答案 2 :(得分:0)

很抱歉因为屁股疼痛,我已经设法自己解决了 - 感谢您的帮助。

我刚刚在删除按钮上使用了onclick="javascript:RemoveQual(' + qual_add_current + ');"