javascript24点游戏计算
24点游戏⼤概在很早就完成了，中间jvascript程序也改动过，今天就发出来了，游戏规则是这样的：⽹页加载后，点击发牌产⽣  4 个随机数，范围是从1到9之间，可以重复。经过加减乘除计算后结果等于24。刚开始写的时候我对html,css不是很熟勉强布局完成效果还可以看啊，⾄今也没改动。javascript是经过sea.js模块化加载的，sea.js就不介绍了哈。
直接上代码来说吧：
(function(window){
var PorkeGame=function(){
this.fourPorke=[];
this.yunsuanfu=['+','-','*','/','(',')'];
}
var p=PorkeGame.prototype;
//从min和max之间产⽣⼀个随机数
p._getRandomNumber=function(min,max){
var total = max -min + 1;
return Math.floor(Math.random() * total) + min;
}
//产⽣随机数
p.randomFourPorke=function(){
for(var i=1;i<=4;i++){
}
return this.r;
}
p.operator=function(arr){
var array=['+','-','*','/','(',')',1,2,3,4,5,6,7,8,9];
for(var j=0;j<array.length;j++){
if(array[j]==arr){
return array[j];
}
}
}
//经过各种运算后输出24点计算结果
var ten=[],str="",count=0,arr1=[],arr2=[];
arr2=this.randomFourPorke();
for(var i=1;i<=4;i++){
arr1.push(arr2.shift());
}
ateAllExprestion(arr1);
if(ten == undefined){
return arr1;
}else{
for(var i=0;i<=10;i++){
if(this.operator((String().substr(i,1)))=="+"){
str+='<img src="imgs/1.png"/>';
}
if(this.operator((String().substr(i,1)))=='-'){
str+='<img src="imgs/2.png"/>';
}
if(this.operator((String().substr(i,1)))=='*'){
str+='<img src="imgs/3.png"/>';
}
if(this.operator((String().substr(i,1)))=='/'){
str+='<img src="imgs/4.png"/>';
}
if(this.operator((String().substr(i,1)))=="("){
str+='<img src="imgs/leftbracket.png"/>';
}
if(this.operator((String().substr(i,1)))==")"){
str+='<img src="imgs/rightbracket.png"/>';
}
if(this.operator((String().substr(i,1)))=="1"){
str+=1;
}
if(this.operator((String().substr(i,1)))=='2'){
str+=2;
}
if(this.operator((String().substr(i,1)))=='3'){
str+=3;
}
if(this.operator((String().substr(i,1)))=='4'){
str+=4;
}
if(this.operator((String().substr(i,1)))=="5"){
}
if(this.operator((String().substr(i,1)))=="6"){
str+=6;
}
if(this.operator((String().substr(i,1)))=='7'){
str+=7;
}
if(this.operator((String().substr(i,1)))=="8"){
str+=8;
}
if(this.operator((String().substr(i,1)))=="9"){
str+=9;
}
}
return arr1;
}
}
//⽣成所有扑克的组合
p._getRandomPorkeIndex=function(arr1){
var tem= [];
tem.push([arr1[0],arr1[1],arr1[2],arr1[3]]);
tem.push([arr1[0],arr1[1],arr1[3],arr1[2]]);
tem.push([arr1[0],arr1[2],arr1[1],arr1[3]]);
tem.push([arr1[0],arr1[2],arr1[3],arr1[1]]);
tem.push([arr1[0],arr1[3],arr1[2],arr1[1]]);
tem.push([arr1[0],arr1[3],arr1[1],arr1[2]]);
tem.push([arr1[1],arr1[0],arr1[2],arr1[3]]);
tem.push([arr1[1],arr1[0],arr1[3],arr1[2]]);
tem.push([arr1[1],arr1[2],arr1[0],arr1[3]]);
tem.push([arr1[1],arr1[2],arr1[3],arr1[0]]);
tem.push([arr1[1],arr1[3],arr1[2],arr1[0]]);
tem.push([arr1[1],arr1[3],arr1[0],arr1[2]]);
tem.push([arr1[2],arr1[1],arr1[0],arr1[3]]);
tem.push([arr1[2],arr1[1],arr1[3],arr1[0]]);
tem.push([arr1[2],arr1[0],arr1[1],arr1[3]]);
tem.push([arr1[2],arr1[0],arr1[3],arr1[1]]);
tem.push([arr1[2],arr1[3],arr1[0],arr1[1]]);
tem.push([arr1[2],arr1[3],arr1[1],arr1[0]]);
tem.push([arr1[3],arr1[1],arr1[0],arr1[2]]);
tem.push([arr1[3],arr1[1],arr1[2],arr1[0]]);
tem.push([arr1[3],arr1[0],arr1[1],arr1[2]]);
tem.push([arr1[3],arr1[0],arr1[2],arr1[1]]);
tem.push([arr1[3],arr1[2],arr1[0],arr1[1]]);
tem.push([arr1[3],arr1[2],arr1[1],arr1[0]]);
return tem;
}
//⽣成所有符合计算的运算符的组合
p._getRandomOptIndex=function(){
var temArr = [];
temArr.push([this.yunsuanfu[0],this.yunsuanfu[1],this.yunsuanfu[2]]);    temArr.push([this.yunsuanfu[0],this.yunsuanfu[2],this.yunsuanfu[1]]);    temArr.push([this.yunsuanfu[1],this.yunsuanfu[0],this.yunsuanfu[2]]);    temArr.push([this.yunsuanfu[1],this.yunsuanfu[2],this.yunsuanfu[0]]);    temArr.push([this.yunsuanfu[2],this.yunsuanfu[0],this.yunsuanfu[1]]);    temArr.push([this.yunsuanfu[2],this.yunsuanfu[1],this.yunsuanfu[0]]);    temArr.push([this.yunsuanfu[3],this.yunsuanfu[0],this.yunsuanfu[1]]);    temArr.push([this.yunsuanfu[3],this.yunsuanfu[1],this.yunsuanfu[0]]);    temArr.push([this.yunsuanfu[0],this.yunsuanfu[1],this.yunsuanfu[3]]);    temArr.push([this.yunsuanfu[0],this.yunsuanfu[3],this.yunsuanfu[1]]);    temArr.push([this.yunsuanfu[1],this.yunsuanfu[0],this.yunsuanfu[3]]);    temArr.push([this.yunsuanfu[1],this.yunsuanfu[3],this.yunsuanfu[0]]);    temArr.push([this.yunsuanfu[3],this.yunsuanfu[0],this.yunsuanfu[2]]);    temArr.push([this.yunsuanfu[3],this.yunsuanfu[2],this.yunsuanfu[0]]);
temArr.push([this.yunsuanfu[0],this.yunsuanfu[2],this.yunsuanfu[3]]);
temArr.push([this.yunsuanfu[0],this.yunsuanfu[3],this.yunsuanfu[2]]);
temArr.push([this.yunsuanfu[2],this.yunsuanfu[0],this.yunsuanfu[3]]);
temArr.push([this.yunsuanfu[2],this.yunsuanfu[3],this.yunsuanfu[0]]);
temArr.push([this.yunsuanfu[3],this.yunsuanfu[1],this.yunsuanfu[2]]);
temArr.push([this.yunsuanfu[3],this.yunsuanfu[2],this.yunsuanfu[1]]);
temArr.push([this.yunsuanfu[1],this.yunsuanfu[2],this.yunsuanfu[3]]);
temArr.push([this.yunsuanfu[1],this.yunsuanfu[3],this.yunsuanfu[2]]);
temArr.push([this.yunsuanfu[2],this.yunsuanfu[1],this.yunsuanfu[3]]);
temArr.push([this.yunsuanfu[2],this.yunsuanfu[3],this.yunsuanfu[1]]);
return temArr;
}
/
/ 混合所有的数字符合括号组合
var signs =this._getRandomOptIndex();
var cards =this._getRandomPorkeIndex(arr1);
var array = [];
for(var i = 0,j=cards.length;i<j;i++){
for(var m = 0, n=signs.length; m < n; m++){
for(var q = 0; q < 7; q++){
switch(q){
case 0:array.push(cards[i][0] + signs[m][0] + cards[i][1] + signs[m][1] +cards[i][2] + signs[m][2] +cards[i][3]); break;
case 1:array.push('(' + cards[i][0] + signs[m][0] + cards[i][1] +')' + signs[m][1] +cards[i][2] + signs[m][2] +cards[i][3]); break;
case 2:array.push('(' + cards[i][0] + signs[m][0] + cards[i][1] + signs[m][1] +cards[i][2] +')' + signs[m][2] +cards[i][3]); break;
case 3:array.push(cards[i][0] + signs[m][0] + '(' +  cards[i][1] + signs[m][1] +cards[i][2] +')' + signs[m][2] +cards[i][3]); break;
case 4:array.push(cards[i][0] + signs[m][0] + '(' +  cards[i][1] + signs[m][1] +cards[i][2] + signs[m][2] +cards[i][3]  +')'); break;
case 5:array.push(cards[i][0] + signs[m][0] + cards[i][1] + signs[m][1] + '(' + cards[i][2] + signs[m][2] +cards[i][3]  +')'); break;
case 6:array.push('(' + cards[i][0] + signs[m][0] + cards[i][1] +')' + signs[m][1] + '(' + cards[i][2] + signs[m][2] +cards[i][3] +')'); break;            }
}
}
}
//进⾏组装完成后进⾏24点计算
for(var y=0;y<array.length;y++){
if(eval(array[y])==24){
return array[y];
}
}
}
define(function(require,exports,module){ports=PorkeGame;})
})
define(function(require){
/
/依赖加载 zepto和index模块js
var $=require("zepto"),PorkeGame=require("index");
var Case=new PorkeGame();
var odd=[1,3,5,7];
var even=[0,2,4,6];
var count=0;
var tp = $.fx.cssPrefix + 'transform';
var tp2="-webkit-transition";
(function(){
//发牌
$('#licensing').attr("disabled",true);
$('#result').attr("disabled",true);
$("#shuffle").click(function(){
var arr=[];
placement();
$('.poker-box li').each(function(index){
if($(this).filter(".b")){
$(this).filter(".b").css(tp,'perspective(400px) rotateY(0deg)');
}
if($(this).filter(".a")){
$(this).filter(".a").css(tp,'perspective(400px) rotateY(90deg)');
}
});
setTimeout(function(){
$.each(even,function(i,n){
$(".poker-box li").eq(n).animate({perspective:"400px", rotateY:"-90deg"},1000,'',function(){
$('.poker-box li').eq(odd[i]).children().first().attr("src","img/"+arr[i]+".bmp");
$(".poker-box  li").eq(odd[i]).css("display","block").animate({perspective:"400px",rotateY:"0deg"},1000,'',
javascript substrfunction(){
//点击洗牌查看结果
$("#licensing").removeAttr("disabled").text("洗牌");
$("#result").removeAttr("disabled").text("查看结果");
}).css(tp,'perspective(400px) rotateY(0deg)');
count++;
}).css(tp,'perspective(400px) rotateY(-90deg)');
});
},1)
});
//洗牌
$('#licensing').click(function(){
$("#Shuffle").attr("disabled",true);
$("#result").attr("disabled",true);
$("#source span").addClass("one");
$('.poker-box li').each(function(index){
if($(this).filter(".b")){
$(this).filter(".b").css(tp,'perspective(400px) rotateY(-90deg)');
}
if($(this).filter(".a")){
$(this).filter(".a").css(tp,'perspective(400px) rotateY(0deg)');
}
});
$("ul li").each(function(index){
$("ul li").eq(odd[index]).animate({perspective:"400px",rotateY:"90deg"},1000,'',function(){
$("ul li").eq(even[index]).animate({perspective:"400px",rotateY:"0deg"},1000,'',function(){
$("#shuffle").removeAttr("disabled");
$('#licensing').attr("disabled",true).text("洗牌禁⽤");
$('#result').attr("disabled",true).text("查看结果禁⽤");
});
})
})
})
$('#result').click(function(){
$("#source span").removeClass("one");
})
})()
})
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<style>
.one{display:none;}
#container{width:450px;height:150px;margin:0 auto;}
#container .poker-box{position:relative;}
#container .poker-box li{display:inline-block;list-style-type:none;}
#container .poker-box li:nth-child(2){position:absolute;left:37px;top:0px;display:none;}
#container .poker-box li:nth-child(4){position:absolute;left:136px;top:0px;display:none;}
#container .poker-box li:nth-child(6){position:absolute;left:235px;top:0px;display:none;}
#container .poker-box li:nth-child(8){position:absolute;left:334px;top:0px;display:none;}
#PorkeGame{margin:0 auto;width:320px;}
#PorkeGame button{width:100px;height:23px;outline:none;line-height:23px;}
#source{background-color:white;width:430px;height:90px;border-radius:5px;margin:0 auto;margin-bottom:30px; font-size:70px;}  #source span{text-align:center;}
body{background:url(./img/0.jpg);background-size:cover;}
</style>
</head>
<body>
<div id="container">
<ul class="poker-box" id="poker-box">
<li class="b"><img src="img/pk.bmp"/></li>
<li class="a"><img src=""/></li>
<li class="b"><img src="img/pk.bmp"/></li>
<li class="a"><img src=""/></li>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。