用JavaScript中lodash编写双色球
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
header {
width: 500px;
height: 100px;
margin: 0 auto;
background-color: red;
border-radius: 10px;
} header>h1 {
color: orange;
text-align: center;
line-height: 100px;
} li {
list-style: none;
} input {
width: 40px;
height: 30px;
} .change {
width: 500px;
height: 400px;
background-color: burlywood;
margin: 0 auto;
} .change>p:first-child {
text-align: center;
font-size: 24px;
} .change>p:nth-child(2) {
color: red;
} .change>p:nth-child(4) {
color: blue;
} #red {
display: flex;
} #red input {
margin-right: 20px;
} #star {
width: 100px;
height: 50px;
margin-left: 190px;
} .return {
color: red;
font-size: 20px;
text-align: center;
}
</style>
</head> <body> <header>
<h1>中国福利双色球</h1>
</header> <div class="change">
<p>请选择号码</p>
<p>红球(1~33)</p>
<ul id="red">
<li id="red1">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
<input type="text" value="">
</li>
</ul>
<p>蓝球(1~16)</p>
<ul id="blue">
<li>
<input type="text" value="" id="playblue">
</li>
</ul>
<p>
<input type="button" value="确定" id="star">
</p>
<p>彩票结果为：</p>
<p class="return"></p>
</div> <script src="./lodash.js"></script>
<script>
window.onload = function () {
let num = [];//创建空数组
while (true) {
num.push(_.random(1, 33));//将随机数添加到num中
num = _.uniq(num)//去重
if (num.length == 6) {
break;
}
}
let num1 = [];//蓝球数
num1.push(_.random(1, 16));
console.log(num, num1)
let star = document.getElementById('star');
let playblue = document.getElementById('playblue');
let end =document.querySelector('.return');
let input = document.querySelectorAll('#red1>input')//得到所有的input
console.log(input)
star.onclick = function () {
//红球
let play = [];
_.forEach(input, function (text) {
let test = text.value-0;//获取输入的值
play.push(test)
})
//蓝球
let play1=[];
play1.push(playblue.value-0);
//判断
//红球判断
restu=_.intersection(num,play);
//蓝球判断
restu1=_.intersection(num1,play1);
if(restu.length==6&&restu1.length==0){
end.innerHTML="恭喜你获得二等奖"
}else if(restu.length==4||(restu.length==3&&restu1.length==1)){
end.innerHTML='恭喜你获得五等奖：10元'
}else if(restu.length==1&&restu1.length==1){
end.innerHTML='恭喜你获得六等奖：5元'
}else if(restu.length==0){
end.innerHTML='未中奖'
}else if(restu.length==6&&restu1.length==1){
end.innerHTML="恭喜你获得一等奖500万"
}else if(restu.length==5&&restu1.length==1){
end.innerHTML="恭喜你获得三等奖3000元"
}
} }
</script>
</body> </html>
用JavaScript中lodash编写双色球的更多相关文章
- 用JavaScript中jQuery编写放大镜效果
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [技术翻译]在现代JavaScript中编写异步任务
本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...
- javascript中的this与函数讲解
前言 javascript中没有块级作用域(es6以前),javascript中作用域分为函数作用域和全局作用域.并且,大家可以认为全局作用域其实就是Window函数的函数作用域,我们编写的js代码, ...
- 【总结】浅谈JavaScript中的接口
一.什么是接口 接口是面向对象JavaScript程序员的工具箱中最有用的工具之一.在设计模式中提出的可重用的面向对象设计的原则之一就是“针对接口编程而不是实现编程”,即我们所说的面向接口编程,这个概 ...
- JavaScript中的this陷阱的最全收集
JavaScript来自一门健全的语言,所以你可能觉得JavaScript中的this和其他面向对象的语言如java的this一样,是指存储在实例属性中的值.事实并非如此,在JavaScript中,最 ...
- JavaScript中的匿名函数及函数的闭包
1.匿名函数 函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数:就是没有函数名的函数. 1.1 函数的定义,首先简单介绍一下函数的定义,大致可分为三种方式 第一种: ...
- 【转】JavaScript中的原型和继承
请在此暂时忘记之前学到的面向对象的一切知识.这里只需要考虑赛车的情况.是的,就是赛车. 最近我正在观看 24 Hours of Le Mans ,这是法国流行的一项赛事.最快的车被称为 Le Mans ...
- 浅显易懂的理解JavaScript中的this关键字
在JavaScript中this变量是一个令人难以摸清的关键字,this可谓是非常强大,充分了解this的相关知识有助于我们在编写面向对象的JavaScript程序时能够游刃有余. 1. 一般用处 对 ...
- JavaScript中的this陷阱的最全收集 没有之一
当有人问起你JavaScript有什么特点的时候,你可能立马就想到了单线程.事件驱动.面向对象等一堆词语,但是如果真的让你解释一下这些概 念,可能真解释不清楚.有句话这么说:如果你不能向一个6岁小孩解 ...
随机推荐
- PHP实用系统函数之数组篇
PHP中十分实用的系统函数 array array_merge 说明:array array_merge ( array $array1 [, array $... ] ) 将一个或多个数组的单元合 ...
- css权威指南读书笔记-第10章浮动和定位
这一章看了之后真是豁然开朗,之前虽然写了圣杯布局和双飞翼布局,有些地方也是模糊的,现在打算总结之后再写一遍. 以下都是从<css权威指南>中摘抄的我认为很有用的说明. 浮动元素 一个元素浮 ...
- Java中int与Integer的区别
转自https://www.cnblogs.com/guodongdidi/p/6953217.html import java.lang.Integer; public class intDemo{ ...
- 简单使用git上传代码
1,首先在github上面创建一个仓库 2,在本地目录中右击,选择git bash 3,将github上的仓库克隆到本地目录,(这个就是您的仓库) git clone https://github.c ...
- Android画廊效果
Android画廊效果 前言:Gallery是一个内部元素控件,可以水平滚动,并且可以把当前选择的子元素定位在它中心的布局组件:画廊Gallery一般用来显示可左右移动图片的列表(具体请看实例). 效 ...
- Jarvis OJ-Reverse题目Writeup
做一道更一道吧233333 DD-Android Easy 下载apk,先安装一下试试吧…… 猜测是输入正确的内容后给flag吧 将后缀改成zip,解压,用dex2jar处理classes.dex,然 ...
- 初识WCF6
参考:http://blog.csdn.net/songyefei/article/details/7397296 元数据交换 通过前两篇的学习,我们了解了WCF通信的一些基本原理,我们知道,WCF服 ...
- Redis(二)：c#连接Redis
1.nuget StackExchange.Redis 2.建立RedisHelper类: public class RedisHelper { /// <summary> /// 连接字 ...
- 在notepad++中快速插入当前时间方法
插件是notepad++的一大优势,而要实现此功能,也必须借助TextFX插件. 1.点击"插件"-->"Plugin Manager"-->&qu ...
- CentOS随笔 - 6.CentOS7安装Git服务器
前言 转帖请注明出处: http://www.cnblogs.com/Troy-Lv5/ 版本管理当然是选择git..反正我是被svn坑怕了... 这次安装的是git 2.18.0 点击下载 准备安装 ...