如何通过 jQuery 随机 {1|2|3|4}？

Question

<div class="xxx">Number is {1|2|3|4}, and {one|two|three|four}</div>

<div class="yyy"></div>

...

var data = $(".xxx").text();

$(".yyy").html(data);

http://jsfiddle.net/tQeCv/

我只需要这个输入：

数字是{1|2|3|4}，{one|two|three|four}

像这样随机 输出：

数字是3和4

我不知道该怎么做......对不起:(

Answer 1

这不是 JSON。我假设您想随机拆分 1,2,3 和 4 个元素。您必须在 | 上拆分数据。字符，然后随机排序您的结果（或编写您自己的随机播放算法）。

var data = $(".xxx").text(); // initial data

var results = data.split("|"); // split on the "|" and store into results

然后您必须从数组中获取一个随机元素：

var randomNumber = Math.floor((Math.random()*4)+1); // random number (no more than 4 or the array will be out of bounds)

随机播放/显示数据：

var firstElement = results[randomNumber];
randomNumber = Math.floor((Math.random()*4)+1);
var secondElement = results[randomNumber];

等等……

Answer 2

尝试一些简单的开始，比如理解 split() 等。

这里有一些东西：

var data = $(".xxx").text(),
    numbs = data.split('{')[1].split('}')[0].split('|'),
    words = data.split('{')[2].split('}')[0].split('|'),
    newdata = data.split('{')[0]+' '+numbs[Math.floor(Math.random()*numbs.length)];
    newdata += data.split('}')[1].split('{')[0]+' '+words[Math.floor(Math.random()*words.length)];

$(".yyy").html(newdata);

​

FIDDLE

然后继续用正则表达式替换。

编辑：

要使其更具动态性并使用更多占位符，您可以使用一些正则表达式来执行以下操作：

var data = $(".xxx").text(),
    placeholder = data.match(/{(.*?)}/gi);

$.each(placeholder, function(i,e) {
    var options = e.split('|'),
        randOpt = options[Math.floor(Math.random()*options.length)];
    data = data.replace(e, randOpt.replace(/({|})/g, ''));
});

$(".yyy").html(data);

FIDDLE ​

Answer 3

你可以使用Math对象.random()方法：

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Math/random

function randomNumber()  
{  
  num = Math.ceil(Math.random() * (1 - 4) + 4); 
  $(".yyy").text(num) 
}