php - 一个简单的随机发生器

Question

如何创建一个生成器，当按下按钮时它会选择我添加到列表中的随机单词。

例如，“Apple”、“Banana”和“Pear”在我的列表中，我希望最终用户按下按钮，代码将获取其中一个水果，但完全随机，我该怎么做？

问候，约翰

Answer 1

首先，您提到了一个列表；这直接转换为数组。其次，您有有限数量的选项，显示在数组中，并且您想随机选择一个。这意味着随机选择一个索引（整数）。由于数组从 0 开始，您无法选择通过最后一个索引的项目，因此您需要选择0 和数组长度之间的随机范围。

如果您只是想通过按下按钮从列表中获取随机项目，您肯定希望将其隔离到前端，即 javascript：

var randomWords = [
    'Apple',
    'Banana',
    'Pear'
];

function getRandomWordFromList(list) {
    var index = getRandomInt(0,list.length);
    return randomWords[index];
}

function getRandomInt(min,max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

document.getElementById('myButton').onclick = function() { // for example's sake...
    document.getElementById('theOutput').innerHTML = getRandomWordFromList(randomWords);
};

（getRandomInt来自在特定范围内的 JavaScript 中生成随机整数？）

此外，如果您的数组是零散的（即缺少一些索引），您可以使用（更安全，尽管更复杂）：

function arrayKeys(array) {
    var i,keys = [];
    for ( i in array ) {
        if ( isInt(i) && array.hasOwnProperty(i) ) {
            keys.push(i);
        }
    }
    return keys;
}

function isInt(value) { 
    return !isNaN(parseInt(value,10)) && (parseFloat(value,10) == parseInt(value,10)); 
}

function getRandomInt(min,max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

function getRandomWordFromList(list) {
    var keys = arrayKeys(list); // be sure to only get indices that exist
    var key = getRandomInt(0,keys.length-1);
    return list[keys[key]];
}

var randomWords = [
    'Apple',
    'Banana',
    'Pear'
];

delete randomWords[1]; // remove 'Banana'

var theWord = getRandomWordFromList(randomWords);

如果有服务器端影响随机列表，您可以通过 PHP 填充 randomWords 数组，如下所示：

<?php
$randomWords = array(
    'Apple',
    'Banana',
    'Pear'
);
?>
<script type="text/javascript">
var randomWords = [<?php echo "'".implode("','",$randomWords)."'"; ?>];
// don't forget your getRandomWord functions
</script>

---

奖励：如果随机化必须完全发生在服务器端，即 php，这里是一个翻译：

<?php
$randomWords = array(
    'Apple',
    'Banana',
    'Pear'
);

echo $randomWords[array_rand($randomWords)]; // output somewhere
?>

Answer 2

一个简单的 javascript 闭包来演示。

var generateRandom = (function () {
    var fruit;
    return function () {
        if (fruit === undefined) {
            fruit = ["Apple", "Banana", "Pear"];
        }
        return fruit[Math.floor(Math.random() * fruit.length)];
    }
}());

这里 Math.random 给出了一个介于 0 和 1 之间的数字。所以我将把它与数组长度相乘，得到一个介于 0 和fruit.length 之间的数字。这将是我们要选择的项目的索引。

Answer 3

使用 Javascript：

var fruit;
var rand = Math.random();
if (rand <= 0.33) {
  fruit = 'Apple';
} else if (rand > 0.34 && rand <= 0.66) {
  fruit = 'Banana';
} else if (rand > 0.67) {
  fruit = 'Pear';
}

Math.random()将返回一个介于 0 和 1 之间的数字。

Answer 4

这里只是一个简单的例子，说明如何做到这一点。操作（在本例中为单击）由 JavaScript 处理，因此我强烈建议在那里处理所有操作。这个想法是，当您可以将其打包到 JavaScript 对象中时，您不需要单独的 html 或特别是 php 担心这一点。这段代码远非完美，但我认为这对你来说是一个很好的起点。请注意，要运行此脚本，您需要做的就是包含此脚本并简单地键入（在 js 中）wordRandomizer.run(myElem);whenmyElem是对 dom 中的元素的引用（我只是在此示例中使用了主体）。

演示在这里。

var wordRandomizer = { //the name of your "app"
  run : function(targetElem) { //this is the function you will call to make it all happen
    var markup = this.createMarkup();
    targetElem.appendChild(markup);
  },
  createMarkup : function() {
    var that = this;
    var frag = document.createDocumentFragment();

    this.elem = document.createElement('span');

    var button = document.createElement('button');
    button.innerText = 'Change Item';
    button.addEventListener('click', function() {
      that.changeItem();
    });

    frag.appendChild(this.elem);
    frag.appendChild(button);

    return frag;
  },
  changeItem : function() {
    var rand = this.getRandInt(1, this.items.length) - 1; // -1 because arrays start at 0
    this.elem.innerText = this.items[rand];
  },
  getRandInt : function(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
  },
  items : [
    'itemA',
    'itemB',
    'itemC',
    'itemD'
  ]
};

wordRandomizer.run(document.body); 
//here, you just pass in the element where your "app" will attach its output. 
//If you want to get fancier, you could make more things optional, add more functionality, etc and pass in those options here.

哦，您应该添加一些逻辑以确保所选项目与以前不同。有几种方法可以轻松做到这一点，但我会把乐趣留给你 :)