百色金融新闻网
您的位置：百色金融新闻网 > 金融新闻 > 菜鸟教程之javascript实现连连看游戏（功能实现）-xt615

菜鸟教程之javascript实现连连看游戏（功能实现）-xt615

作者：百色金融新闻网日期：

返回目录：金融新闻

最新资讯《菜鸟教程之javascript实现连连看游戏（功能实现）-xt615》主要内容是xt615,<img border='0' src="img/BackImg.jpg" width='100%' height='100%'，现在请大家看具体新闻资讯。

菜鸟教程之javascript实现连连看游戏（功能实现）

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

<script type="text/css"></script>

</head>

<body>

<!--<body background="http://127.0.0.4img/BackImg.jpg" >-->

<img border='0' src="http://127.0.0.4img/BackImg.jpg" width='100%' height='100%' style='position: absolute;left:0px;top:0px;z-index: -1'>

<!--<bgsoundsrc="http://127.0.0.4BackMusic/whatMe.mp3" loop=#>-->

<!--<embed hidden="no" loop="1" src="http://127.0.0.4BackMusic/whatMe.mp3" align="right"></embed>-->

</body>

</html>

<script type="text/javascript" src="http://127.0.0.4js/ButtonLinkGame.js" ></script>

<script type="text/javascript" src="http://127.0.0.4js/Text.js" ></script>

<script>

//******************************************************

//定义变量

//******************************************************

var guanqiaDengji=""; //关卡等级

var Grade=0; //定义变量，表示分数

var GuoGrade=0;

var RowValue=0; //定义RowValue变量，表示行

var ColValue=0; //定义ColValue变量，表示列

var index=0; //定义index,控制随机生成下标的范围

var Timer=null; //创建计时器

var time1=60; //创建倒计时时间

var BoardArray=new Array(); //创建数组,存储按钮

//保存第一次、第二次点击的按钮对象

click1=null;

click2=null;

//创建数组，存储牌面背景图片

//var ImgArr=["img_1/wan1.png","img_1/wan2.png","img_1/wan3.png","img_1/wan4.png","img_1/wan5.png","img_1/wan6.png","img_1/wan7.png","img_1/wan8.png","img_1/wan9.png"

//,"img_1/tiao1.png","img_1/tiao2.png","img_1/tiao3.png","img_1/tiao4.png","img_1/tiao5.png","img_1/tiao6.png","img_1/tiao7.png","img_1/tiao8.png","img_1/tiao9.png"

//,"img_1/tong1.png","img_1/tong2.png","img_1/tong3.png","img_1/tong4.png","img_1/tong5.png","img_1/tong6.png","img_1/tong7.png","img_1/tong8.png","img_1/tong9.png"

//,"img_1/dong.png","img_1/xi.png","img_1/nan.png","img_1/bei.png","img_1/zhong.png","img_1/fa.png","img_1/bai.png"];

var ImgArr=["img/BKHM_1.jpg","img/BKHM_2.jpg","img/BKHM_3.png","img/CL_1.jpg","img/CL_2.jpg","img/CL_3.jpg","img/CL_4.jpg","img/CL_5.jpg"

,"img/KK_1.jpg","img/KK_2.jpg","img/KK_3.jpg","img/LZX_1.jpg","img/LZX_2.jpg","img/LZX_3.jpg","img/LZX_4.jpg","img/ZCX_1.jpg"

,"img/ZCX_2.jpg","img/ZJL_1.jpg","img/ZJL_2.jpg","img/ZJL_3.jpg","img/ZJL_4.jpg","img/ZJL_5.png","img/ZJL_6.jpg","img/ZJL_7.jpg","img/ZJL_8.jpg"];

//******************************************************

//实例化分数显示框,将分数框添加到悬浮父窗口中

//******************************************************

var GradeShow=new Text("txtShow","当前分数:"+Grade,70,30,"100","20");

GradeShow.setBackgroundColor("#00FFFF");

GradeShow.addToParent();

//******************************************************

//创建初级按钮,将初级按钮添加到悬浮父窗口中，并实现对应功能

//******************************************************

var ButtonPrimary=new Button("btnPrm","","","",295,30,"80","30")

ButtonPrimary.setText("初级");

ButtonPrimary.setBackgroundColor("#FFC0CB");

ButtonPrimary.setClick(Primary);

ButtonPrimary.addToParent();

//**********************************

function Primary()

{

clear(); //重置游戏

guanqiaDengji="初级";

click1=null;

click2=null;

GuoGrade=700;

Grade=0;

index=6;

RowValue=7;

ColValue=7;

time1=60;

setTimer(); //计时器

GradeShow.setText("当前分数:"+Grade);

Update(RowValue,ColValue,index);

}

//******************************************************

//创建中级级按钮,将中级按钮添加到悬浮父窗口中，并实现对应功能

//******************************************************

var ButtonIntermediate=new Button("btnItd","","","",385,30,"80","30")

ButtonIntermediate.setText("中级");

ButtonIntermediate.setBackgroundColor("#FF69B4");

ButtonIntermediate.addToParent();

ButtonIntermediate.setClick(Intermediate);

//**********************************

function Intermediate()

{

clear(); //重置游戏

guanqiaDengji="中级";

click1=null;

click2=null;

GuoGrade=800;

Grade=0;

index=14;

RowValue=8;

ColValue=8;

time1=90;

setTimer(); //计时器

GradeShow.setText("当前分数:"+Grade);

Update(RowValue,ColValue,index);

}

//******************************************************

//创建高级按钮,将高级按钮添加到悬浮父窗口中，并实现对应功能

//******************************************************

var ButtonExpert=new Button("btnEp","","","",475,30,"80","30")

ButtonExpert.setText("高级");

ButtonExpert.setBackgroundColor("#C71585");

ButtonExpert.addToParent();

ButtonExpert.setClick(Expert);

//**********************************

function Expert()

{

clear(); //重置游戏

guanqiaDengji="高级";

click1=null;

click2=null;

GuoGrade=1000;

Grade=0;

index=18;

RowValue=10;

ColValue=10;

time1=120;

setTimer(); //计时器

GradeShow.setText("当前分数:"+Grade);

Update(RowValue,ColValue,index);

}

//******************************************************

//实例化倒计时显示框,将倒计时框添加到悬浮父窗口中，并实现对应功能

//******************************************************

var timeShow1=new Text("txtShow","剩余时间："+time1+"s",180,30,"100","20");

timeShow1.setBackgroundColor("red");

timeShow1.addToParent();

//Timer=setInterval(setTimer,1000);

//实现倒计时功能

function setTimer()

{

Timer=setInterval(Time1,1000);

}

function Time1()

{

time1--;

timeShow1.setText("剩余时间："+time1+"s");

if(Grade>=GuoGrade)

{

alert("*恭喜过关*");

clearInterval(Timer);

}

if(time1<=0)

{

alert("很遗憾！未能通关");

clearInterval(Timer);

}

}

//******************************************************

//创建重置按钮,将重置按钮添加到悬浮父窗口中，并实现对应功能

//******************************************************

var ButtonReset=new Button("btnSet","","","",560,30,"50","30")

ButtonReset.setBackgroundImage("img/Set.jpg");

ButtonReset.addToParent();

ButtonReset.setClick(ResetBtn);

function ResetBtn()

{

var rS=window.prompt("请选择过关等级！");

if(rS=="初级")

{

Primary();

}

else if(rS=="中级")

{

Intermediate();

}

else if(rS=="高级")

{

Expert();

}

}

//******************************************************

//创建暂停按钮按钮,将暂停按钮添加到悬浮父窗口中，并实现对应功能

//******************************************************

var ButtonStop=new Button("btnSet","","","",615,30,"50","30")

ButtonStop.setBackgroundImage("img/stop.png");

ButtonStop.addToParent();

ButtonStop.setClick(StopBtn);

function StopBtn()

{

alert("当前暂停！是否继续？");

}

//******************************************************

//清空按钮数组（牌）

//******************************************************

function clear()

{

for(var i=1;i<=RowValue;i++)

{

for(var j=1;j<=ColValue;j++)

{

BoardArray[i][j].removeToParent();

}

}

BoardArray.length=0; //将存放按钮的数组长度初始化为0

clearInterval(Timer);

}

//******************************************************

//排布按钮显示，初始化连连看牌面

//******************************************************

function Update(_RowValue,_ColValue,_index)

{

for(var i=1;i<=_RowValue;i++)

{

//创建数组，存储按钮

BoardArray[i]=new Array();

for(var j=1;j<=_ColValue;j++)

{

//产生随机数，表示牌的下标.随机数为小数，所以需要转换成整形

ImgIndex=Math.floor((Math.random()*_index));

//实例化按钮对象

//BoardArray[i][j]=new Button(i+""+j,"",i,j,40*j+10,50*i+20,"30","40");

BoardArray[i][j]=new Button(i+""+j,"",i,j,60*j+10,60*i+20,"50","50");

//将按钮子对象添加到悬浮窗父对象中

BoardArray[i][j].addToParent();

//设置按钮中的背景图片，使图片在按钮中显示

BoardArray[i][j].setBackgroundImage(ImgArr[ImgIndex]);

//调用点击事件

BoardArray[i][j].setClick(Eliminate_1);

}

}

}

//******************************************************

//实现消除牌面的功能

//******************************************************

function Eliminate_1(obj)

{

//如果第一个按钮为空（按钮还没有被点击）

if(click1==null)

{

click1=obj;

}

else

{

click2=obj;

//如果第一次点击的牌的路径与第二次点击的相等（牌相同）

if(click1.GetBackgroundImage()==click2.GetBackgroundImage())

{

//判断是否在同一行

if(click1.GetRow()==click2.GetRow())

{

//在同一行上，列相邻

if(click1.GetCol()-click2.GetCol()==1 || click2.GetCol()-click1.GetCol()==1)

{

//如果点击的两张牌在同一行并且列相邻，则调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

//消除一对加45分

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

//在同一行上，列不相邻.第一次点击的牌的列大于第二次点击的

if(click1.GetCol()-click2.GetCol()>1)

{

var i=0;

//从列小的牌的下一位置开始循环到列大的牌的前一位置

for(i=click2.GetCol()+1;i<click1.GetCol();i++)

{

//在同一行，两次点击的牌中间有其他牌

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

//如果循环到i==click1.GetCol()，则证明中间不隔其他牌

if(i==click1.GetCol())

{

//如果点击的两张牌在同一行、列相邻但中间没有任何牌，则调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

//消除一对加45分

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

//在同一行上，列不相邻.第一次点击的牌的行列小于第二次点击的

if(click2.GetCol()-click1.GetCol()>1)

{

var i=0;

for(i=click1.GetCol()+1;i<click2.GetCol();i++)

{

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

if(i==click2.GetCol())

{

//如果点击的两张牌在同一行、列相邻但中间没有任何牌，则调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

//消除一对加45分

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

//判断是否在同一列

else if(click1.GetCol()==click2.GetCol())

{

//判断在同一列上，行是否相邻

if(click1.GetRow()-click2.GetRow()==1 || click2.GetRow()-click1.GetRow()==1)

{

//如果点击的两张牌在同一列并且在同一行，则调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

//在同一列，不在同一行，第一次点击的牌的行大于第二次点击的

if(click1.GetRow()-click2.GetRow()>1)

{

var i=0;

//从行小的牌的下一位置开始循环到行大的牌的前一位置

for(i=click2.GetRow()+1;i<click1.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

//两次点击的牌中间没有其他牌

if(i==click1.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

//在同一列，不在同一行，第一次点击的牌的行小于第二次点击的

if(click2.GetRow()-click1.GetRow()>1)

{

var i=0;

for(i=click1.GetRow()+1;i<click2.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

//两次点击的牌中间没有其他牌

if(i==click2.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！")

}

}

}

//***************************************************************

// 消除不再同行同列的***一个拐角（两张牌之间只有两条连线）

//***************************************************************

if(click1.GetRow()!=click2.GetRow() && click1.GetCol()!=click2.GetCol())

{

//第一种情况：第一次点击的牌的行小于第二次的

if(click2.GetRow()-click1.GetRow()>=1)

{

//且第一次点击的牌的列小于第二次的

if(click2.GetCol()-click1.GetCol()>=1)

{

//判断角1是否为空（没有牌）——路径1

if(BoardArray[click2.GetRow()][click1.GetCol()].getHide()=="none")

{

var i=0;

for(i=click1.GetRow()+1;i<click2.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

if(i==click2.GetRow())

{

var j=0;

for(j=click1.GetCol()+1;j<click2.GetCol();j++)

{

if(BoardArray[click2.GetRow()][j].getHide()!="none")

{

break;

}

}

if(j==click2.GetCol())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

//判断角2是否为空（没有牌）——路径2

else if(BoardArray[click1.GetRow()][click2.GetCol()].getHide()=="none")

{

alert("判断角2是否为空（没有牌）——路径2");

var i=0;

for(i=click1.GetCol()+1;i<click2.GetCol();i++)

{

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

if(i==click2.GetCol())

{

var j=0;

for(j=click1.GetRow()+1;j<click2.GetRow();j++)

{

if(BoardArray[j][click2.GetCol()].getHide()!="none")

{

break;

}

}

if(j==click2.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

else

{

alert("不能消除！");

}

}

//第一次点击的牌的列大于第二次

if(click1.GetCol()-click2.GetCol()>=1)

{

//判断角1是否为空（没有牌）——路径1

if(BoardArray[click1.GetRow()][click2.GetCol()].getHide()=="none")

{

var i=0;

for(i=click2.GetCol()+1;i<click1.GetCol();i++)

{

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

if(i==click1.GetCol())

{

var j=0;

for(j=click1.GetRow()+1;j<click2.GetRow();j++)

{

if(BoardArray[j][click2.GetCol()].getHide()!="none")

{

break;

}

}

if(j==click2.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

//判断角2是否为空（没有牌）——路径2

else if(BoardArray[click2.GetRow()][click1.GetCol()].getHide()=="none")

{

alert("//判断角2是否为空（没有牌）——路径2");

var i=0;

for(i=click1.GetRow()+1;i<click2.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

if(i==click2.GetRow())

{

var j=0;

for(j=click2.GetCol()+1;j<click1.GetCol();j++)

{

if(BoardArray[click2.GetRow()][j].getHide()!="none")

{

break;

}

}

if(j==click1.GetCol())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

else

{

alert("不能消除！");

}

}

}

//第二种情况：第一次点击的牌的行大于第二次的

if(click1.GetRow()-click2.GetRow()>=1)

{

//且第一次点击的牌的列小于第二次

if(click2.GetCol()-click1.GetCol()>=1)

{

//角1为空（没有牌）——路径1

if(BoardArray[click2.GetRow()][click1.GetCol()].getHide()=="none")

{

var i=0;

for(i=click2.GetRow()+1;i<click1.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

if(i==click1.GetRow())

{

var j=0;

for(j=click1.GetCol()+1;j<click2.GetCol();j++)

{

if(BoardArray[click2.GetRow()][j].getHide()!="none")

{

break;

}

}

if(j==click2.GetCol())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

//角2为空（没有牌）——路径2

else if(BoardArray[click1.GetRow()][click2.GetCol()].getHide()=="none")

{

var i=0;

for(i=click1.GetCol()+1;i<click2.GetCol();i++)

{

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

if(i==click2.GetCol())

{

var j=0;

for(j=click2.GetRow()+1;j<click1.GetRow();j++)

{

if(BoardArray[j][click2.GetCol()].getHide()!="none")

{

break;

}

}

if(j==click1.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

else

{

alert("不能消除！");

}

}

//且第一次点击的牌的列大于第二次的

if(click1.GetCol()-click2.GetCol()>=1)

{

//角1为空（没有牌）——路径1

if(BoardArray[click1.GetRow()][click2.GetCol()].getHide()=="none")

{

var i=0;

for(i=click2.GetCol()+1;i<click1.GetCol();i++)

{

if(BoardArray[click1.GetRow()][i].getHide()!="none")

{

break;

}

}

if(i==click1.GetCol())

{

var j=0;

for(j=click2.GetRow()+1;j<click1.GetRow();j++)

{

if(BoardArray[j][click2.GetCol()].getHide()!="none")

{

break;

}

}

if(j==click1.GetRow())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除！");

}

}

}

//角2为空（没有牌）——路径2

else if(BoardArray[click2.GetRow()][click1.GetCol()].getHide()=="none")

{

var i=0;

for(i=click2.GetRow()+1;i<click1.GetRow();i++)

{

if(BoardArray[i][click1.GetCol()].getHide()!="none")

{

break;

}

}

if(i==click1.GetRow())

{

var j=0;

for(j=click2.GetCol()+1;j<click1.GetCol();j++)

{

if(BoardArray[click2.GetRow()][j].getHide()!="none")

{

break;

}

}

if(j==click1.GetCol())

{

//调用setHide方法隐藏它们（消除了）

BoardArray[click1.GetRow()][click1.GetCol()].setHide(true);

BoardArray[click2.GetRow()][click2.GetCol()].setHide(true);

Grade+=45;

GradeShow.setText("当前分数:"+Grade);

}

else

{

alert("不能消除!");

}

}

}

else

{

alert("不能消除！");

}

}

}

}

//***************************************************************

// 消除第三种情况的（两牌之间的连线有两个拐角），使用分类判断法，小的们，大王写不下去了，你们接上

//***************************************************************

//if()

//{}

}

//点击两次牌后做出响应的动作后，则将它们重置。进行下一次点击消除判断

click1=null;

click2=null;

}

}

//调用初始化牌面方法

Update();

</script>

如果出现什么bug，请留言通知大王。谢谢。大王要去打妖怪了。

本文标签：xt615(10)Button(1)Grade(1)click1.GetRow ( )(1)调用setHide方法隐藏(1)click2.GetCol ( )(1)click2.GetRow ( )(1)Update(1)BoardArray(1)break ;(1)click1.GetCol ( )(1)

相关阅读

关键词不能为空

标签导航

基金管理人 中国证监会 国泰金龙债券 第二号 基金托管人 招募说明书 公积金存款利率 购房者 公积金 荆州市 公积金贷款利率 住房公积金 存款利率 公积金贷款 月供 株洲市 黄山 人人车二手车 c2c B2C 内容 二手车 Ask吱吱吱 吱道不知道 李三吱 吱道二手车 堂主撸车 Fuck My Car 我国私募股权投资基金 中小型企业 私募股权基金 私募基金 资本市场 私募股权投资基金 p2p 腾邦国际 中银通支付 互联网×金融 300178 广州 旅游 新西兰 澳新银行 学生签证 电汇流程 留学汇款专用账户 移民局 break ; BoardArray Update click2.GetRow ( ) click1.GetCol ( ) click2.GetCol ( ) click1.GetRow ( )

热门文章

经济新闻_金融新闻_财经要闻_理财投资_理财保险_百色金融新闻网