<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>36选7</title>
<script>
//先循环36个数,放到num里面
//给按钮添加事件
//点击的时候 随机7个数放到jg里面
var btn = null,
num = null,
jg = null; window.onload = function(){
init();
initDom();
event();
}
//初始化变量
function init(){
btn = document.getElementById("btn");
num = document.getElementById("num");
jg = document.getElementById("jg");
}
//初始化页面元素的值
function initDom(){
var str = "";
for(var i = 1 ;i<37;i++){
str += i + ",";
}
str = str.substr(0,str.length-1); //把36个数字组成的字符串的最后一个元素删除
num.innerHTML = str;
}
//添加事件
function event(){
btn.onclick = xuanze;
}
//点击按钮的时候调用方法
function xuanze(){
//随机七个数放到结果里面
var str = "";
var n = 0;
for(var i = 0 ;i<7;i++){
n++;
var zhi = parseInt(Math.random()*36)+1;
console.log(str.indexOf(zhi));
if(str.indexOf(zhi) == -1){
str += zhi+",";
}else{
i--;
}
}
// jg.innerHTML = str+";总共循环了"+n+"次";
jg.value = str+";循环了"+n+"次";
}
</script>
</head> <body>
<!--页面部分-->
<div id="num"></div>
<button id="btn">选择</button>
<!--结果为:<span id="jg"></span>-->
结果为:<input type="text" width="1000px" id="jg" value="">
</body>
</html>

原生JS实现彩票36选7不重复(优化)的更多相关文章

  1. 原生js的联动全选

    开发应用中有很多工具可以使用,下面介绍一个原生js写的联动全选思路!!! <!DOCTYPE html> <html lang="en"> <head ...

  2. 原生js实现三级复选框

    工作中要做一个三级的复选框,用js实现了一下,从项目中把相关代码抽取出来了,有相关需求的可以参考一下.亲测可用. <!DOCTYPE html> <html> <head ...

  3. 原生JS实现购物车全选多选按钮功能

    对于JS初学者来说,一个完整的购物车实现还是挺难的,逻辑功能挺多.写出完整功能,能提升不少JS基础,下面实现购物车全选多选按钮功能: 首先HTML及CSS部分: <style> table ...

  4. 原生js中实现全选和反选功能

    <!DOCTYPE html>      <html>      <head lang="en">          <meta char ...

  5. 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

    折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

  6. JavaCodeTra 36选7 彩票抽奖

    想写个小代码试试自己的运气.然并卵.并不能猜中 import java.util.Random; import java.util.Scanner; /** * */ /** * @author Ha ...

  7. 原生js实现在表格用鼠标框选并有反选功能

    今天应同学要求,需要写一个像Excel那样框选高亮,并且实现框选区域实现反选功能.要我用原生js写,由于没什么经验翻阅了很多资料,第一次写文章希望各位指出不足!! 上来先建表 <div clas ...

  8. 原生JS实现购物车结算功能代码+zepto版

    html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  9. 原生JS 表单提交验证器

    转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言 最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定 不用外部 ...

随机推荐

  1. VS2010-MFC(文档、视图和框架:分割窗口)

    转自:http://www.jizhuomi.com/software/226.html 上一节讲了文档.视图和框架结构中各对象之间的关系,本节主要讲讲在MFC中如何分割窗口. 分割窗口概述      ...

  2. C#winform解析marc显示在datagridview中以及marc卡片显示

    结果显示:marc显示: 卡片显示: 程序一个类: public class MARC { #region 界面上要显示的元素 public string ztm = "";//正 ...

  3. latex ctex 的section不能写中文, /href

    问题描述:再使用超链接 /href 后发现section{}不能写入中文,以前是好使的,经过查询验证,需要在引导区里加入 \hypersetup{CJKbookmarks=true} 即可恢复正常.

  4. 河南理工大学算法协会暑期集训积分赛(二)网络同步赛-Numbers of interval-尺取法

    原题链接:https://hpuoj.com/contest/24/problem/E/ 思路:一般的尺取法,不断更新左端点的值. #include<iostream> #include& ...

  5. AI入门---从破解AI开始

    我这里说的AI,并不是人工智能(Artificial Intelligence),只是Adobe illustrator.旁边有做设计的朋友,在他的指引下,对这个工具还颇感兴趣.就先下载个工具,闲暇时 ...

  6. linux内核参数sysctl.conf,TCP握手ack,洪水攻击syn,超时关闭wait(转)

    http://www.xshell.net/linux/Linux_sysctl_conf.html 优化Linux内核sysctl.conf参数来提高服务器并发处理能力 Posted by 破冰 o ...

  7. <jquery>滚动例子

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. vue初学之node.js安装、cnpm安装、vue初体验

    1. 如果本机没有安装node运行环境,请下载node 安装包进行安装.地址:https://nodejs.org/en/ 2.装完,使用cmd命令行输入:node -v回车 如果输出版本号则成功. ...

  9. sql.xml where ids in的写法

    <if test="iSurfaceTypeArray != null"> AND b.i_SurfaceType in <!-- 根据外观检查查询 --> ...

  10. 箭头函数报错:Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.

    解决:根目录新建babel.config.js加入如下内容 module.exports = { presets: [ "@babel/preset-env", "@ba ...