jQuery使用insertAfter在div中的另一个div之后移动一个div

时间:2014-07-10 13:30:07

标签: jquery

我从2小时起就失败了。我在点击div id="msg"div class="meta anchor"之后尝试移动<i class="icon-delete delete"></i>。由于它的结构方式,整个事情让我陷入困境。

我已经标记了div id =&#34; msg&#34;应该搬到。你能帮忙吗?我失败的努力在下面。

    <div class="reQ">
        <div class="post">
            <div class="entry">
                <div class="links"> 
                    <div class="icons"><i class="icon-delete delete"></i></div>
                </div>

                <div class="meta anchor">
                    Content
                </div>
                !-- div id="msg" goes here --!
            </div>
        </div>
    </div>

    <div id="msg">Div with Message</div>

的jQuery

$('.delete').live('click', function() {

    var self = $(this);
    // $('#msg').insertAfter(self.parent()).show();
    // self.parent().after('.msg');

    self.parents('.reQ').$('#msg').insertAfter('.anchor').show();
});

Fiddle

修改 html部分在页面上重复多次。它持有帖子。我需要msg只能点击点击图标的帖子。

3 个答案:

答案 0 :(得分:1)

试试这个

$('.delete').on('click', function() {
    var anchor = $(this).closest('.post').find('.anchor');
    $('#msg').insertAfter(anchor).show();
});

http://jsfiddle.net/dhR36/4/

您还在使用jquery 1.7,因此您应该将live更改为.on

以下是关于insertAfter http://api.jquery.com/insertafter/

的文档

答案 1 :(得分:0)

试试这个

<强>的js

$(".icon-delete").click(function() {
    $("#msg").insertAfter(".meta");
})

答案 2 :(得分:0)

不完美但功能:

$( ".meta" ).click(function() {
    $( "#msg" ).insertAfter( $( ".meta" ));
    $( "#msg" ).removeAttr( "id" );
});