0

我想重新排序显示网页的某些元素。按照这个问题的答案，我有以下代码：

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

        <script>
        function reorder() {
            var grp = $(".myItems").children();
            var cnt = grp.length;

            var temp,x;
            for (var i = 0; i < cnt; i++) {
                temp = grp[i];
                x = Math.floor(Math.random() * cnt);
                grp[i] = grp[x];
                grp[x] = temp;
            }
            $(grp).remove();
            $(".myItems").append($(grp));
        }
        </script>
    </head>

    <body onload="reorder();">
    <div class="myItems">
     <div class="item" title="Row 1">1</div>
     <div class="item" title="Row 2">2</div>
     <div class="item" title="Row 3">3</div>
    </div>
    </body>
</html>

我遇到的问题是我还需要根据<div>标签出现的顺序修改标签的内容。title在此示例中，我需要更改标记中的行标识符。

例如，刷新后，可能的结果是：

    <div class="myItems">
     <div class="item" title="Row 1">2</div>
     <div class="item" title="Row 2">1</div>
     <div class="item" title="Row 3">3</div>
    </div>

或者

    <div class="myItems">
     <div class="item" title="Row 1">3</div>
     <div class="item" title="Row 2">2</div>
     <div class="item" title="Row 3">1</div>
    </div>

请注意，标题的顺序保持不变，而显示的数字会发生变化。

4

2 回答 2

1

grp在你随机化它们之后循环遍历，对于每个，将属性重置title为'Row '+i, where i = index in array + 1。
如果您这样做，您可以在随机步骤中执行此操作

grp[i].setAttribute('title','Row '+(i+1));
grp[x].setAttribute('title','Row '+(x+1));

这导致调用.setAttribute更多次，但需要少一个循环。

于 2012-09-11T14:04:03.923 回答
1

在之前添加$(grp).remove()：

for(var i = 0; i < cnt; i ++) {
    grp[i].title = "Row " + (i + 1);
}
于 2012-09-11T14:05:41.440 回答