如何克隆和附加 <a href= 的锚 html 值"#" >芭芭拉对</a> div 容器很好

Question

如何克隆带有多个<a href="#">Barbara is so nice</a>元素的列表的锚html值并将其附加到div容器中。我可以克隆.counter元素并将其附加到容器中，但不能使用锚点。

我在这里创建了一个jsFidle

这是我的js代码：

$(window).load(function(){
    $('.ordered-list li a').on("click", function() {
        var button = $(this);
        $('.overlay').fadeIn('slow',function(){
            button.find('.user-comment-list').clone().fadeIn(1000).appendTo('.overlay-content-inner');
            button.find('.counter').clone().appendTo('.overlay-title-content');
    });
});
    $('.icon-remove').click(function(){
        $('.overlay').fadeOut('slow');
        $('.overlay-content-inner, .overlay-title-content').empty();
    });
});

Answer 1

我不知道为什么不能得到锚点值。你已经在锚里了。

$('.ordered-list li a').on("click", function() {

您正在将单击事件绑定到锚点。将引用当前锚点的局部变量命名为button只会增加混乱。

代替：

button.find('.counter').clone().appendTo('.overlay-title-content');

如果您想附加锚HTML，可以执行以下操作：

$('.overlay-title-content').append(button.html());

DEMO-附加锚HTML值

如果DEMO的链接失效，下面是新代码：

$('.ordered-list li a').on("click", function() {
    var button = $(this); // not a button! "this" is referencing the clicked anchor.
    $('.overlay').fadeIn('slow', function() {
        button.find('.user-comment-list').clone().fadeIn(1000).appendTo('.overlay-content-inner');
        $('.overlay-title-content').append(button.html());
        //button.find('.counter').clone().appendTo('.overlay-title-content');
    });
});
$('.icon-remove').click(function() {
    $('.overlay').fadeOut('slow');
    $('.overlay-content-inner, .overlay-title-content').empty();
});​

希望这能有所帮助。