javascript - 随机选择元素

Question

我有以下标记。

<div class="area 1">
    <div id="area-count">
        23
    </div>
</div>
<div class="area 2">
    <div id="area-count">
        52
    </div>
</div>
<div class="area 3">
    <div id="area-count">
        0
    </div>
</div>
<div class="area 4 friendly">
    <div id="area-count">
        21
    </div>
</div>
<div class="area 5">
    <div id="area-count">
        23
    </div>
</div>

我想做的是alert()在随机选取的元素之一中找到的数字。我也希望没有任何元素具有 friend 类，到目前为止我有这个，只是在尝试否定该类之前尝试使用 alert() 一个随机数友好。

randomElement = $("area-count").get().sort(function(){
            return Math.round(Math.random())-0.5}).slice(0,1);
            alert(randomElement);

但是这没有输出...我哪里出错了？

Answer 1

1. 您的 ID 必须是唯一的。你应该改变<div id="area-count">至<div class="area-count">
2. 无需对它们进行排序。只需计算出项目数(jQuery 的长度)，然后在 0 和项目数减 1 之间选择一个随机数。使用 eq 从集合中选择此项目。 .

像这样:

<div class="area 1">
    <div class="area-count">
        23
    </div>
</div>
<div class="area 2">
    <div id="area-count">
        52
    </div>
</div>
<div class="area 3">
    <div class="area-count">
        0
    </div>
</div>
<div class="area 4 friendly">
    <div class="area-count">
        21
    </div>
</div>
<div class="area 5">
    <div class="area-count">
        23
    </div>
</div>

<script type="text/javascript">
$(function() {
    var counts = $('.area-count'),
        index = Math.floor( Math.random() * counts.length ),
        item = counts.eq(index);

    alert(item.text());
});
</script>