使用jquery clone()克隆div在IE中不起作用

时间:2013-03-29 02:26:45

标签: javascript jquery

我正在尝试克隆div并将它们附加到容器div中。解决方案我在Chrome中运行良好但在IE中根本不运行。我已经尝试过研究这个,甚至问过这个问题但是找不到真正有用的解决方案。有没有人有任何建议?这就是我到目前为止所拥有的

html看起来有点像

<div class="holdOne"></div>
<div class="holdTwo"></div>
<div class="holdThree"></div>

<div class="productHolder">
    <div class="product"></div>
    <div class="product"></div>
    <div class="product"></div>
    <div class="product"></div>
    <div class="product"></div>
    <div class="product"></div>
</div>

jquery的

$(function() {
    $('.productHolder .product').eq(0).clone().appendTo('.holdOne');
    $('.productHolder .product').eq(1).clone().appendTo('.holdOne');
    $('.productHolder .product').eq(2).clone().appendTo('.holdOne');

    $('.productHolder .product').eq(1).clone().appendTo('.holdTwo');
    $('.productHolder .product').eq(2).clone().appendTo('.holdTwo');
    $('.productHolder .product').eq(3).clone().appendTo('.holdTwo');

    $('.productHolder .product').eq(0).clone().appendTo('.holdThree');
    $('.productHolder .product').eq(5).clone().appendTo('.holdThree');
    $('.productHolder .product').eq(4).clone().appendTo('.holdThree');
});

1 个答案:

答案 0 :(得分:1)

可能是个错误吗? jQuery .clone() .html() in IE Bug

所以也许放弃clone()并只使用元素html()值可以工作?不过,这有点麻烦。

var dummy = $('.productHolder .product').eq(0);
$('.holdOne').append(dummy.html());

显然,您需要为每个 clone 重复此操作。我在Mac上,不能测试IE,但希望这有帮助。看看下面的小提琴,虽然它没有抓住outerHTML。

<强>小提琴

http://jsfiddle.net/URKq5/1/


修改

我找到了另一个可以帮助外部HTML的SO帖子。这应该有助于使它更符合你原来的内容:

$('.holdOne').append($('.productHolder .product').eq(0)[0].outerHTML);

新小提琴

http://jsfiddle.net/URKq5/3/

SO链接

jQuery: outer html()