基于百分比的Javascript内容轮换

时间:2009-06-17 15:53:52

标签: javascript rotation frontend

我需要能够根据这样的百分比旋转占位符div中的内容。轮换将在页面加载时发生。因此,每次用户重新加载页面时,他都有机会在内容占位符中看到内容1,2或3:

内容1 =显示50%的时间
内容2 =显示25%的时间
内容3 =显示25%的时间

我更喜欢Javascript但是如果在前端模板的ASP.NET中有一种更简单的方法,而不是代码隐藏,那也是可以接受的。如果您有解决方案或可以指向我现有的脚本,我将不胜感激。谢谢!

3 个答案:

答案 0 :(得分:10)

实际上没有必要乘以/ floor / ceil:Math.random()函数给出的值大于或等于0且小于1。

如果您更改选项数量或机会百分比,以下代码将更容易维护。

var contentId, random = Math.random();

if (random < 0.5) {
  // option 1: chance 0.0–0.499...
  contentId = 0;
} else (random < 0.75) {
  // option 2: chance 0.50—0.7499...
  contentId = 1;
} else {
  // option 3: chance 0.75–0.99...
  contentId = 2;
}

loadContent(contentId);

答案 1 :(得分:0)

这是一个快速的黑客,可能有更好的方法。

var randomnumber=Math.floor(Math.random()*4)
if((num==0) || (num==1)) {
//show hidden div or document.write (50% probability)
} else if (num==2) {
//show hidden div or document.write (25% probability)
} else {
//show hidden div or document.write (25% probability)
}

答案 2 :(得分:0)

对于脚本的随机部分,您只需要使用Math.random 丑陋和硬编码的东西看起来像这样:

var contentToShow = -1;
var NB_MAX = 4;
var myRand = Math.floor(Math.random()*NB_MAX);
if(myRand<1) contentToShow = 1;
else if (myRand<2) contentToShow = 2;
else contentToShow = 3;

然后你只需要用ajax加载内容。

jQuery中的一个例子看起来像:

var myPlaceHolder = $("#myPlaceHolder")
$.myPlaceHolder.load("/mycontents/mycontent_" + contentToShow + ".asp");

但是在页面加载上使用ajax请求不是imo的方法。 (如果服务器处理随机内容,则为2服务器请求而不是1)