Javascript特效之模拟抽奖程序

Javascript特效之模拟抽奖程序

我们经常会看到一些抽奖程序，应该很多都是H5做的，今天我们来看看js怎么实现类似抽奖的程序。

效果图：

点击开始时，会一直跳动文本框的值直到我们点击停止。就类似抽奖的效果。不过这个机率没法设置。

实现思路：

我们先预设好参与抽奖的内容。再写一个setInterval重复执行函数，让文本框一直随机显示我们预设的内容。点击停止时则清除setInterval即可。

js代码：

var   alldata   =   "linkweb,sharejs,csdn,google,baidu,msn,qq,cctv,microsoft,adobe" //抽奖的姓名，以,为分隔   
    
  var   alldataarr   =   alldata.split(",")   
  var   num   =   alldataarr.length-1   
  var   timer   
  function   change(){   
  document.getElementById("oknum").value   =   alldataarr[GetRnd(0,num)];   
  }   
    
  function   start(){   
  clearInterval(timer);   
  timer   =   setInterval('change()',50); //50（毫秒）为变换间隔，越小变换的越快   
  }   
    
  function   ok(){   
  clearInterval(timer);   
  }   
    
  function   GetRnd(min,max){   
  return   parseInt(Math.random()*(max-min+1));   
  }