在 jQuery 中向动态元素添加动画时遇到问题

Question

能否请您看一下this demo，让我知道为什么我无法将.slideDown() 函数添加到在父项之后输入动态div 的过程中所选元素的数量？

$(function () {
    $("button").on("click", function () {
        $(".err").hide();
        var elem = $(this);
        elem.parent().after('<div class="alert alert-danger err" role="alert">Thanks For Adding</div>').slideDown("slow");
    });
});

@import url("https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css");
body {
    padding:50px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div class="well well-sm box">
    <button class="btn btn-default btn-block" type="submit">Add Box</button>
</div>
<div class="well well-sm box">
    <button class="btn btn-default btn-block" type="submit">Add Box</button>
</div>
<div class="well well-sm box">
    <button class="btn btn-default btn-block" type="submit">Add Box</button>
</div>
<div class="well well-sm box">
    <button class="btn btn-default btn-block" type="submit">Add Box</button>
</div>
<div class="well well-sm box">
    <button class="btn btn-default btn-block" type="submit">Add Box</button>
</div>

Answer 1

这应该有效:)

$(function () {
    $("button").on("click", function () {
        var elem = $(this);
        var $div = $('<div/>',{class: 'alert alert-danger err',role: 'alert'}).hide().text('Thanks For Adding');
        $div.insertAfter(elem.parent());
        $div.slideDown("slow");
    });
});

https://jsfiddle.net/dja0jxm3/1/

在 jQuery 中向动态元素添加动画时遇到问题

Having Issue on Adding animation to Dynamic element in jQuery

jquery

jquery-animate