原生JS实现彩票36选7不重复(优化)
<!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不重复(优化)的更多相关文章
- 原生js的联动全选
开发应用中有很多工具可以使用,下面介绍一个原生js写的联动全选思路!!! <!DOCTYPE html> <html lang="en"> <head ...
- 原生js实现三级复选框
工作中要做一个三级的复选框,用js实现了一下,从项目中把相关代码抽取出来了,有相关需求的可以参考一下.亲测可用. <!DOCTYPE html> <html> <head ...
- 原生JS实现购物车全选多选按钮功能
对于JS初学者来说,一个完整的购物车实现还是挺难的,逻辑功能挺多.写出完整功能,能提升不少JS基础,下面实现购物车全选多选按钮功能: 首先HTML及CSS部分: <style> table ...
- 原生js中实现全选和反选功能
<!DOCTYPE html> <html> <head lang="en"> <meta char ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
- JavaCodeTra 36选7 彩票抽奖
想写个小代码试试自己的运气.然并卵.并不能猜中 import java.util.Random; import java.util.Scanner; /** * */ /** * @author Ha ...
- 原生js实现在表格用鼠标框选并有反选功能
今天应同学要求,需要写一个像Excel那样框选高亮,并且实现框选区域实现反选功能.要我用原生js写,由于没什么经验翻阅了很多资料,第一次写文章希望各位指出不足!! 上来先建表 <div clas ...
- 原生JS实现购物车结算功能代码+zepto版
html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...
- 原生JS 表单提交验证器
转载:http://www.cnblogs.com/sicd/p/4613628.html 一.前言 最近在开发一个新项目,需要做登陆等一系列的表单提交页面.在经过“缜密”的讨论后,我们决定 不用外部 ...
随机推荐
- (转)SQL盲注攻击的简单介绍
转:http://hi.baidu.com/duwang1104/item/65a6603056aee780c3cf2968 1 简介 1.1 普通SQL注入技术概述 目前没有对SQL ...
- System.Clollections.ICollection.cs
ylbtech-System.Clollections.ICollection.cs 1.程序集 mscorlib, Version=4.0.0.0, Culture=neutral, PublicK ...
- Docker系列(五):Docker网络机制(上)
Linux路由机制打通网络 路由机制是效率最好的 docker128上修改Docker0的网络地址,与docker130不冲突 vi /usr/lib/systemd/system/docker.se ...
- Docker系列(四):Docker容器互联
基于Volume的互联 为什么需要Volume docker文件系统是分层的,下面的是全部是只读的,最上面的是可写层,容器中的进程如果修改了某个文件,比如修改了下层的某个文件,其实是在最顶层复制下层文 ...
- 第一篇:spring+springMVC项目启动最终笔记(一web.xml)
1.web应用启动从web.xml开始,首先创建一个全局的上下文(Context),名字叫ServletContext,可以理解为一间图书馆,或一个数据结构(如map,但是比map牛多了),整个结构类 ...
- 如何解决:修改.gitignore后,不生效
1.git rm -r --cached . 删除缓存 2.git add . 添加要提交的文件 3.git commit -m "update .gitignore" 提交 ...
- wdatapicker 时间选择器——例
效果: html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> < ...
- iOS逆向系列-脱壳
概述 通过iOS逆向系列-逆向App中使用class-dump工具导出App的Mach-O文件所有头文件.Hopper工具分析App的Mach-O文件代码大概实现.但是这些前体是App的Mach-O没 ...
- 移植 TinyLogin
下载 从 http://tinylogin.busybox.net/downloads/tinylogin1.4.tar.bz2下载 tinylogin1.4 到/tmp 目录当中,并解压. 修改 ...
- vagrant生成多台虚拟机
第一种: # -*- mode: ruby -*- # vi: set ft=ruby : # All Vagrant configuration is done below. The "2 ...