Question

如何使下面的代码在两个div内切换内容1,2,3,4,5,6？当前代码仅混合数字1,2,3,4,5,6。但我需要的是数字1,2,3,4,5和6在2个div中随机显示。

实施例： 2和6

按f5 4和1

按f5 5和3

怎么做？

* {
  font: 18pt verdana;
}
ul {
  margin: 20px;
  padding: 0 1px;
  width: 2.0em;
  border: 1px solid #006699;
}
li {
  margin: 1px 0;
  padding: 3px 0;
  color: #FFF;
  background-color: #006699;
  text-align: center;
}

<head>
  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

  <script type='text/javascript'>
    for (var $x = $(".content li"), i = $x.length - 1, j, temp; i >= 0; i--) {
      j = Math.floor(Math.random() * (i + 1)), temp = $x[i], $x[i] = $x[j], $x[j] = temp;
    }
    $x.each(function(i, li) {
      $(".content").append(li);
    });
  </script>


</head>

<body>
  <div id="n"></div>
  <ul class="content">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
    <li>6</li>
  </ul>

</body>

Answer 1

你可以使用slice()从混合集中获取两个元素，试试这个：

$(".content li").detach();
var y = $x.slice(0,2);
y.each(function(i, li) { $(".content").append(li); });

仅需2个div即可查看6个div的内容

1 个答案:

Updated Fiddle Demo