0

当 'top' 是 where 字符串时,使用 clone(rue, false).inject('myList', 'top') 会反转项目顺序。必须有一种优雅的排序方式吗?我的方法错了吗?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-gb" xml:lang="en-gb">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="js/moo.1.4.5/core.js"></script>
    <script type="text/javascript">
        window.addEvent('domready', function () {


            $('myList').getChildren().each( function (el, i)  { 
                el.clone(true, false).addClass('clone').inject('myList', 'top');
                el.clone(true, false).addClass('clone').inject('myList', 'bottom');
            }) ;


        });
    </script>
</head>
<body>
    <ul id="myList">
        <li><p>Slide 1</p></li>
        <li><p>Slide 2</p></li>
        <li><p>Slide 3</p></li>
        <li><p>Slide 4</p></li>
        <li><p>Slide 5</p></li>
    </ul>
</body>
</html>

返回

<ul id="myList">
   <li class="clone"><p>Slide 3</p></li>
    <li class="clone"><p>Slide 2</p></li>
    <li class="clone"><p>Slide 1</p></li>
    <li><p>Slide 1</p></li>
    <li><p>Slide 2</p></li>
    <li><p>Slide 3</p></li>
    <li class="clone"><p>Slide 1</p></li>
    <li class="clone"><p>Slide 2</p></li>
    <li class="clone"><p>Slide 3</p></li>
</ul>
4

2 回答 2

0

看看你在做什么inject('top')...... 列表的顶部始终是相同的位置 - 列表的顶部。

例如

1 2 3         <--original
1 1 2 3       <--clone 1 + insert top
2 1 1 2 3     <--clone 2 + insert top
3 2 1 1 2 3   <--clone 3 + insert top

您必须从要克隆的块的末尾开始,然后向后工作:

1 2 3         <--original
3 1 2 3       <--clone 3 + insert top
2 3 1 2 3     <--clone 2 + insert top
1 2 3 1 2 3   <--clone 1 + insert top
于 2013-01-22T15:49:42.317 回答
0

取决于你的目标。如果您的目标是克隆列表并将其注入顶部,则可以按照当前的思路执行此操作:

http://jsfiddle.net/dimitar/xNWrM/

var list = $('myList'),
    lis = list.getElements('li');

lis.reverse().each(function(el){
    el.clone(true, true).addClass('clone').inject(list, 'top');
});

可能有一种更优雅的方法来克隆它们,方法是在循环它们时在先前注入的元素之后注入,这将保存 Elements.reverse 调用。

于 2013-01-22T18:16:16.237 回答