javascript生成不重复的随机数

题目来源：在慕课学习jQuery过程中一道测试题。

初始时:<ul>元素中仅显示5个<li>元素,其中包含还包括最后一个<li>元素,<a>元素中的显示"更多"字符.

当点击"更多"链接时,自身内容变为"简化",同时,<ul>元素中显示全部的<li>元素.

当点击"简化"链接时,自身内容变为"更多",同时,<ul>元素中仅显示包含最后一个<li>元素在内的5个元素.

核心点：他没讲需隐藏哪几个<li>元素啊，那么我希望列出8个<li>元素，点简化随机隐藏前7个<li>元素中的3个。

思路：

①从0~6中生成3个随机数。

②判断3个随机数是否相等，不相等则执行隐藏操作。

③3随机数有重复，则重新执行函数。

实现：生成0~6的一个随机数

代码如下:

var ran1=parseInt(Math.random()*7); //Math.random()生成[0,1)的一个随机数

完整代码：

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script language="javascript" type="text/javascript" src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <title>挑战题</title>
  </head>

  <body>
    <ul>
      <li>0</li>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
      <li>7</li>
    </ul>
    <a id="btn" onclick="cli()">简化</a>
  </body>
  <script>
    $(function cli(){
      $("#btn").css("cursor","pointer");
      if($("#btn").html()=="简化"){
      var ran1=parseInt(Math.random()*7);
      var ran2=parseInt(Math.random()*7);
      var ran3=parseInt(Math.random()*7); //①从0~6中生成3个随机数完成
      if(ran1!=ran2&&ran1!=ran2&&ran2!=ran3){ //②判断3个随机数是否相等，不相等则执行操作。
      $('li:eq('+ran1+')').css('display','none');
      $('li:eq('+ran2+')').css('display','none');
      $('li:eq('+ran3+')').css('display','none');
      $("#btn").html("更多");
      }else{　　//③3随机数有重复，则重新执行函数。
        cli();
      }
      }

      else{
        $("li:hidden").css('display','list-item');
        $("a:contains('更多')").html("简化");
      }

      });

  </script>
</html>

收获一：

代码如下:

var ran=parseInt(Math.random()*(max-min+1)+min); //生成一个[min,max]区间的一个随机数

收获二：

反思了下，决定写个在一定[min,max]区间，生成n个不重复的随机数的封装函数。

　　思路一：先生成n个[min,max]区间随机数，比较是否重复，如重复则返回，再次执行。

　　演示地址：http://jsbin.com/yupuyehuqa/edit?html,js,output

　　封装函数：

function my_ran(n,min,max){
 var arr=[];
 for(i=0;i<n;i++){
  arr[i]=parseInt(Math.random()*(max-min+1)+min);
 }
 for(i=0;i<n;i++){
  for(j=i+1;j<n;j++){
   if(arr[i]==arr[j]){
    my_ran(n,min,max);
    return fault;
   }
  }
 }
 return arr;
}

　　思路二：生成第i个[min,max]区间的随机数，并与之前i-1个数比较，如有重复，令i=i-1;重复生成第i个随机数。

　　演示地址：http://jsbin.com/zorunotosi/edit?html,js,output

　　封装函数：

function my_ran2(n,min,max){
 var arr=[];
 for(i=0;i<n;i++){
  arr[i]=parseInt(Math.random()*(max-min+1)+min);
  for(j=0;j<i;j++){
   if(arr[i]==arr[j]){
    i=i-1;
    break;
   }
  }
 }
 return arr;
}

　　思路三：生成[min,max]区间的一个顺序数组，打乱数组，输出前n个值。

　　演示地址：http://jsbin.com/zorunotosi/edit?html,js,output

　　封装函数：

function my_ran3(n,min,max){
 var arr=[];
 var arr2=[];
 for(i=0;i<max-min+1;i++){
  arr[i]=i+min;
 }
 for(var j,x,i=arr.length;i;j=parseInt(Math.random()*i),x=arr[--i],arr[i]=arr[j],arr[j]=x);
 for(i=0;i<n;i++){
  arr2[i]=arr[i];
 }
 return arr2;
}

　　思路四：生成[min,max]区间的一个顺序数组，从中随机选出一个值，然后在数组中删掉这个值，再选第二个随机值。

　　演示地址：http://jsbin.com/zorunotosi/edit?html,js,output

　　封装函数：

function my_ran4(n,min,max){
 var arr=[];
 var arr2=[];
 for(i=0;i<max-min+1;i++){
  arr[i]=i+min;
 }
 for(i=0;i<n;i++){
  var x=parseInt(Math.random()*arr.length);
  arr2[i]=arr[x];
  for(j=x;j<arr.length;j++){
   arr[j]=arr[j+1];
  }
  arr.length=arr.length-1;
 }
 return arr2;
}

太晚了，明儿有空再调格式了。

以上所述就是本文的全部内容了，希望大家能够喜欢。

赞 (0)

相关推荐

  • JS生成某个范围的随机数【四种情况详解】

    前言: JS没有现成的函数,能够直接生成指定范围的随机数. 但是它有个函数:Math.random()  这个函数可以生成 [0,1) 的一个随机数. 利用它,我们就可以生成指定范围内的随机数. 而涉及范围的话,就有个边界值的问题.这样就包含四种情况: 1)min ≤ r ≤ max  (一般这种比较常见) 2)min ≤ r < max 3) min < r ≤ max 4)min < r < max 一.min ≤ r ≤ max function RandomNumBoth(

  • js生成随机数之random函数随机示例

    JavaScript Math.random()内置函数 random函数返回值 返回0和1之间的伪随机数,可能为0,但总是小于1,[0,1) random函数示例 //返回随机数 document.write(Math.random()); //返回10-20的随机数 document.write(Math.random()*(20-10)+10); //返回指定范围的随机数(m-n之间)的公式 document.write(Math.random()*(n-m)+m); 基于时间,亦可以产生

  • 使用js Math.random()函数生成n到m间的随机数字

    摘要: 本文讲解如何使用js生成n到m间的随机数字,主要目的是为后期的js生成验证码做准备. Math.random()函数返回0和1之间的伪随机数,可能为0,但总是小于1,[0,1) 生成n-m,包含n但不包含m的整数: 第一步算出 m-n的值,假设等于w 第二步Math.random()*w 第三步Math.random()*w+n 第四步parseInt(Math.random()*w+n, 10) 生成n-m,不包含n但包含m的整数:​ 第一步算出 m-n的值,假设等于w 第二步Math

  • JavaScript 产生不重复的随机数三种实现思路

    在 JavaScript 中,一般产生的随机数会重复,但是有时我们需要不重复的随机数,如何实现?下面就来讲解三种方法产生不重复的随机数,并进行比较,看那种方法效率高. 方法一 思路:首先创建一个1到3000的数组,每次取一个数,然后去除数组中取出的这个数, 这样就可以实现永不重复. 复制代码 代码如下: <script type="text/javascript"> var count=3000; var originalArray=new Array;//原数组 //给原

  • JavaScript实现随机数生成器（去重）

    JavaScript实现随机数生成器（去重）

    本文实例为大家分享了js实现随机数生成器的具体代码,供大家参考,具体内容如下 1.实验前准备: Math函数的理解 数组方法的理解 2.实验操作: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>随机数生成</title> </head> <style type="text/c

  • js获取数组任意个不重复的随机数组元素 原创

    复制代码 代码如下: <script language="javascript"> //从一个给定的数组arr中,随机返回num个不重复项 function getArrayItems(arr, num) { //新建一个数组,将传入的数组复制过来,用于运算,而不要直接操作传入的数组; var temp_array = new Array(); for (var index in arr) { temp_array.push(arr[index]); } //取出的数值项,

  • Javascript 生成指定范围数值随机数

    不过经过俺的小小努力之后, 终于让俺摸着门道喽, 问题也就理所当然滴解决掉. 然后就写了个公式, 这样应该可以消失掉这个用法了, 公式: 1. 从1开始 至 任意值 linenum parseInt(Math.random()*上限+1); 2. 从任意值开始 至 任意值 linenum parseInt(Math.random()*(上限-下限+1)+下限); 上面的公式使用了 parseInt(), 因此要加1; 如果使用 Math.ceil() 则不需要加1, 俺习惯于这样写... 目录:

  • js生成随机数的方法实例

    js生成随机数主要用到了内置的Math对象的random()方法.用法如:Math.random().它返回的是一个 0 ~ 1 之间的随机数.有了这么一个方法,那生成任意随机数就好理解了.比如实际中我们可能会有如下的需要: (1)生成一个 0 - 100 之间的随机整数,那么则可以: parseInt(100*Math.random()); 注意:因为Math.random()的返回值是包括0和1的,所以这里是有生成0和100的可能性的. (2)生成一个从 m - n 之间的随机整数,例如要生

  • javascript获取不重复的随机数的方法比较

    不重复的随机数方案1:1531 毫秒 一般的思路是先创建一个1-3000的数组,每一次取出一个,然后让这个数组减少一个, 取一个,减少一个,这样就可以做到永不重复了. 随机不重复_www.jb51.net var count=3000; var original=new Array;//原始数组 //给原始数组original赋值 for (var i=0;i 我们 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 不重复的随机数方案2:297毫秒 但是方案1采用了slice方法,此方

  • Js 随机数产生6位数字

    复制代码 代码如下: <script type="text/javascript"> function MathRand() { var Num=""; for(var i=0;i<6;i++) { Num+=Math.floor(Math.random()*10); } document.getElementById("Lb_Random").innerText=Num; document.getElementById(&qu

随机推荐