欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery實(shí)現(xiàn)的五子棋游戲?qū)嵗?/h1>
 更新時(shí)間：2015年06月13日 12:37:56   作者：不吃皮蛋  
這篇文章主要介紹了jQuery實(shí)現(xiàn)的五子棋游戲,以完整實(shí)例形式分析了jQuery實(shí)現(xiàn)五子棋游戲的方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下

本文實(shí)例講述了jQuery實(shí)現(xiàn)的五子棋游戲。分享給大家供大家參考。具體如下：

這是一款非常不錯(cuò)的代碼，就是人工智能方面差了一點(diǎn)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>五子棋</title>
<style type="text/css">
div{margin:0;padding:0;}
div.board{width:561px; height:561px; border:1px solid #ccc; margin:0 auto;}
div.board div{ width:31px; height:31px; border:1px solid #ccc; float:left; cursor:pointer; background-repeat:no-repeat; }
div.board .person { background-image:url('images/1/files/demo/white.jpg')}
div.board .machine{ background-image:url('images/1/files/demo/black.jpg')}
div.board .person_star{background-image:url('images/1/files/demo/white_star.jpg')}
div.board .machine_star{background-image:url('images/1/files/demo/black_star.jpg')}
input.ipt{ display:block; margin:0 auto; margin-top:8px;width:70px}
</style>
</head>
<body>
<div class='board' id='board'>
</div>
<input type='button' value='開(kāi)始游戲' onclick="initGame();
this.value='重新開(kāi)始'" class='ipt'/>
<script type='text/javascript'>
var TRANSVERSE = 16;
var VERTICAL = 16;
var LEFT = 1;
var RIGHT = 2;
var TOP = 3;
var BOTTOM = 4;
var LEFT_TOP = 5;
var LEFT_BOTTOM = 6;
var RIGHT_TOP = 7;
var RIGHT_BOTTOM = 8;
var Chess = function()
{
 var owner = '';
 var victory = false;
 this.getOwner = function(){return owner;};
 this.setOwner = function(value){owner = value;};
 this.getVictory = function(){ return victory;}
 this.setVictory = function(value){ victory = value; } 
}
var Board = function()
{
 var chessBoard = [];
 var isGameOver = false;
 this.getChess = function(point)
 {
  var x = point.x , y = point.y;
  return chessBoard[y][x];
 }
 this.setChess = function(chess , point)
 {
  var x = point.x , y = point.y;
  chessBoard[y][x] = chess;
 }
 this.setVictory = function(points)
 {
  for(var i = 0 ; i < points.length ; i ++)
  {
   for(var j = 0 ; j < points[i].length; j ++)
   {
    var chess = this.getChess(points[i][j]);
    chess.setVictory(true);
   }
  }
 }
 this.getAvaiablePoints = function()
 {
  var avaiable = new Array;
  for(var y = 0 ; y <= VERTICAL ; y ++)
  {
   for(var x = 0 ; x <= TRANSVERSE ; x ++)
   {
    if(chessBoard[y][x]) continue;
    var point = {x : x , y : y};
    avaiable.push(point);
   }
  }
  return avaiable;
 }
 this.getMap = function()
 {
  var map = {};
   for(var y = 0 ; y <= VERTICAL ; y ++)
   {
   for(var x = 0 ; x <= TRANSVERSE ; x++)
    {
    var chess = chessBoard[y][x];
     var value = '';
     if(chess)
     {
     value = chess.getOwner();
     if(chess.getVictory()) value += '_star';
     }
     else 
     {
     value = '';
     }
     map[ x + ',' + y ] = value;
    }
   }
   return map;
 }
 this.gameOver = function()
 {
  return isGameOver = true;
 }
 this.isGameOver = function()
 {
  return isGameOver;
 }
 this.getNextPoint = function(point , direction)
 {
  var next = {x : point.x , y : point.y};
  switch(direction)
  {
   case LEFT :
    next.x -= 1;
    break;
   case RIGHT:
    next.x += 1;
    break;
   case TOP:
    next.y -= 1;
    break;
   case BOTTOM:
    next.y += 1;
    break;
   case LEFT_TOP:
    next.x-= 1 , next.y-= 1;
    break;
   case RIGHT_TOP:
    next.x += 1 , next.y -= 1;
    break;
   case LEFT_BOTTOM:
    next.x -= 1 , next.y += 1;
    break;
   case RIGHT_BOTTOM:
    next.x += 1 , next.y += 1;
    break;
   default :
    alert('方向錯(cuò)誤');
  }
  return next;
 }
 var initialize = function()
 {
  for(var i = 0 ; i <= VERTICAL ; i++ ) chessBoard.push([]);
 } 
 initialize();
}
var Compute = function(role)
{
 var directions = [LEFT , TOP , RIGHT , BOTTOM , LEFT_TOP , LEFT_BOTTOM , RIGHT_TOP , RIGHT_BOTTOM];
 var score = 0;
 var self = this;
 this._computeScore = function(direction)
 {
  throw new Error('未實(shí)現(xiàn)');
 }
 this._convertToPattern = function(chesslist)
 {
  return role.convertToPattern(chesslist)
 }
 this.compute = function(point)
 {
  score = 0;
  for(var i = 0, direction ; direction = directions[i++];)
  {
   score += this._computeScore(point , direction);
  } 
 }
 this.getScore = function(refPoint)
 {
  return score ;
 }
}
var Five = function(role)
{
 Compute.call(this, role);
 var computeScore1 = function(refPoint , direction)
 {
  var predefined = 'IIII';
  var chesslist = role.find(refPoint , direction , 4);
  var pattern = role.convertToPattern(chesslist);
  if(predefined == pattern) return true;
  return false ;  
 }
 var computeScore2 = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 2);
  var next = role.find(refPoint , role.reverseDirection(direction) , 2);
  var prevPattern = role.convertToPattern(prev);
  var nextPattern = role.convertToPattern(next);
  if(prevPattern == 'II' && nextPattern == 'II') return true;
  return false;
 }
 var computeScore3 = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction) , 1);
  var prevPattern = role.convertToPattern(prev);
  var nextPattern = role.convertToPattern(next);
 if(prevPattern == 'III' && nextPattern == 'I') return true;
 return false;  
 }
 this._computeScore = function(refPoint , direction)
 {
  if(computeScore1(refPoint , direction) || computeScore2(refPoint , direction) || computeScore3(refPoint , direction))
   return 100000;
  else return 0;
 }
}
var Four_Live = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var score = 0;
  var prev = role.find(refPoint , direction , 4);
  var next = role.find(refPoint , role.reverseDirection(direction), 1);
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
  if(prevPattern == 'III0' && nextPattern == '0') score = 10000;  
 return score;  
 }
}
var Four_Live1 = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction) , 2);
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);  
  if(prevPattern == 'II0' && nextPattern == 'I0') return 10000;
  else return 0;
 }
}
var Tree_Live = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var score = 0;
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction), 2);
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
  if(prevPattern == 'II0' && nextPattern == '00')
   score += 1000;
  return score;
 }
}
var Tree_Live1 = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 2);
  var next = role.find(refPoint , role.reverseDirection(direction), 3);
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
 if(prevPattern == 'I0' && nextPattern == 'I00')
  return 1000
 else return 0;   
 }
}
var Two_Live = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction), 2); 
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
 if(prevPattern == 'I00' && nextPattern == '00') return 100;
 else return 0;  
 }
}
var One_Live = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction), 3); 
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
 if(prevPattern == '000' && nextPattern == '000') return 10;
 else return 0;  
 }
}
var Four_End = function(role)
{
 Compute.call(this, role);
 this._computeScore = function(refPoint , direction)
 {
  var prev = role.find(refPoint , direction , 3);
  var next = role.find(refPoint , role.reverseDirection(direction), 1); 
  var prevPattern = this._convertToPattern(prev);
  var nextPattern = this._convertToPattern(next);
 if(prevPattern == 'III' && nextPattern == '0') return 150;
 else return 0;  
 }
}
var Role = function(board)
{
 var computers = [];
 var self = this;
 var isVictory = false;
 this.isVictory = function()
 {
  return isVictory;
 }
 var getScore = function(point)
 {
  var score = 0;
  for(var i = 0 , computer; computer = computers[i++];)
  {
   computer.compute(point);
   score += computer.getScore();
  }
  var result = {score: score , point : point};
  return result;
 }
 var getScoreList = function()
 {
  var result = [];
  var avaiablePoints = board.getAvaiablePoints();
  for(var i = 0 , point; point = avaiablePoints[i++];) 
  {
   result.push(getScore(point));
  }
  return result;
 }
 this.getCode = function()
 {
  throw new Error('未實(shí)現(xiàn)');
 }
 this.getPeak = function()
 {
  var scoreInfo = getScoreList();
  scoreInfo.sort(function(a,b){
   return b.score - a.score ;
  });
  return scoreInfo[0];
 } 
 this.convertToPattern = function(chesslist)
 {
  var pattern = '';
  if(!chesslist) return '';
  for(var i = 0 ; i < chesslist.length ; i ++)
  {
   var chess = chesslist[i];
   if(chess == undefined) pattern += '0';
   else if(chess.getOwner() == this.getCode()) pattern += 'I';
   else pattern += 'Y';
  }
  return pattern ;
 }
 this.reverseDirection = function(direction)
 {
  switch(direction)
  {
   case LEFT : return RIGHT;
   case RIGHT : return LEFT;
   case TOP : return BOTTOM;
   case BOTTOM : return TOP;
   case LEFT_TOP : return RIGHT_BOTTOM;
   case RIGHT_BOTTOM : return LEFT_TOP;
   case RIGHT_TOP : return LEFT_BOTTOM;
   case LEFT_BOTTOM : return RIGHT_TOP;
   default : alert('方向錯(cuò)誤');
  }
 } 
 this._checkGameOver = function(point)
 {
  var leftRight = findVictory(point , LEFT);
  var topBottom = findVictory(point , TOP);
  var leftTopRightBottom = findVictory(point , LEFT_TOP);
  var rightTopLeftBottom = findVictory(point , RIGHT_TOP);
  var array = [leftRight , topBottom , leftTopRightBottom , rightTopLeftBottom];
  var victory = [];
  for(var i = 0 ; i < array.length ; i ++)
  {
   if(array[i].length >= 5) victory.push(array[i]);
  }
  if(victory.length > 0)
  {
   board.gameOver();
   board.setVictory(victory);
   isVictory = true;
  }
  if(board.getAvaiablePoints().length ==0) board.gameOver();
 }
 var isLicitPoint = function(point)
 {
  return point.x >= 0 && point.y >= 0 && point.x <= TRANSVERSE && point.y <= VERTICAL 
   && board.getChess(point) && board.getChess(point).getOwner() == self.getCode()
 }
 var findVictory = function(refPoint , direction)
 {
  var reverse = self.reverseDirection(direction);
  var result = [];
  var nextPoint ;
  var currPoint = {x: refPoint.x , y: refPoint.y};
  while(true)
  {
   nextPoint = board.getNextPoint(currPoint, direction);
   if(!isLicitPoint(nextPoint)) break;
   currPoint = {x :nextPoint.x , y:nextPoint.y};
  }
  while(true)
  {
  result.push(currPoint);   
   nextPoint = board.getNextPoint(currPoint , reverse);
   if(!isLicitPoint(nextPoint)) break;  
   currPoint = { x: nextPoint.x , y: nextPoint.y };
  }
  return result;
 }
 this.find = function(point , direction , deep)
 {
  var refPoint = {x: point.x , y : point.y};
  var result = new Array;
   var index = 1;
   var nextPoint;
   while(index <= deep)
   {
   nextPoint = board.getNextPoint(refPoint, direction);
    if(nextPoint.x < 0 || nextPoint.y < 0 || 
    nextPoint.x > TRANSVERSE || nextPoint.y > VERTICAL) return null;
    var chess = board.getChess(nextPoint);
    if(chess) chess.point = {x:nextPoint.x , y:nextPoint.y};
    result.push(chess);
    refPoint = nextPoint;
    index ++;
   }
   return result;
 } 
 var initialize = function()
 {
  computers.push(new Five(self));
  computers.push(new Four_Live(self));
  computers.push(new Tree_Live(self));
  computers.push(new Four_Live1(self));
  computers.push(new Tree_Live1(self));
  computers.push(new Two_Live(self));
  computers.push(new One_Live(self));
  computers.push(new Four_End(self));
 }
 initialize();
}
var Machine = function(board, rival)
{
 Role.call(this, board);
 this.setChess = function()
 {
  if(board.isGameOver()) return;
  var myPeak = this.getPeak();
  var rivalPeak = rival.getPeak();
  var peak ;
  if(myPeak.score >= rivalPeak.score) peak = myPeak;
  else peak = rivalPeak;
  var chess = new Chess();
  chess.setOwner(this.getCode());
  board.setChess(chess, peak.point);
  this._checkGameOver(peak.point);
 }
 this.getCode = function(){return 'machine';}
}
var Person = function(board , rival)
{
 Role.call(this, board);
 this.setChess = function(x,y)
 {
  if(board.isGameOver()) return;
  var point = new Object;
  point.x = x;
  point.y = y;
  var chess = new Chess()
  chess.setOwner(this.getCode());
  board.setChess(chess, point);
  this._checkGameOver(point);
 }
 this.getCode = function(){ return 'person'; }
}
var UIBase = function()
{
 var self = this;
 this._id = '$UI' + (++ UIBase.index);
 this._globalKey = "";
 this.getHTML = function()
 {
  return "";
 }
 var setGlobalKey = function()
 {
  var magic = '$UI_Items';
  self._globalKey = 'window.'+magic+'.'+self._id;  
  window[magic] = window[magic] || {};
  window[magic][self._id] = self;
 }
 var formatHTML = function(html)
 {
  html = html.replace(/\$\$/g, self._globalKey);
  html = html.replace(/&&/g,self._id);
  return html;
 } 
 var initUIBase = function()
 {
  setGlobalKey();
 }
 this.renderHTML = function()
 {
  return formatHTML(this.getHTML());
 }
 this.getDOM = function()
 {
 var dom = document.getElementById(this._id)
  return dom;
 }
 initUIBase();
}
UIBase.index = 0;
var ChessUI = function(board, placeholder)
{
 UIBase.call(this);
 this.setChess = function(){}
 this.getHTML = function()
 {
  var html = '';
  var map = board.getMap();
  for(var key in map)
  {
   var onclick = '';
   var className = map[key];
   if(className == '') onclick='$$._setChess('+ key +')';
  html += '<div onclick="'+ onclick +'" class="'+ className +'"></div>';
  }
  return html;
 }
 this.draw = function()
 {
  var html = this.renderHTML();
  document.getElementById(placeholder).innerHTML = html;
 }
 this._setChess = function(x,y)
 {
  this.setChess(x,y);
 }
 this.draw();
}
function getMSIEVersion()
{
 var regex = /MSIE([^;]+)/;
 var userAgent = navigator.userAgent;
 var result = regex.exec(userAgent);
 if(result) return parseInt(result[1]);
}
function initGame()
{
 var version = getMSIEVersion();
 if(version && version <= 8)
 {
  alert('請(qǐng)使用非IE瀏覽器(ie9、10除外)進(jìn)行游戲(google chrome 、firefox等 )');
  return;
 }
 var board = new Board();
 var person = new Person(board);
 var machine = new Machine(board, person);
 var chessUI = new ChessUI(board, 'board');
 chessUI.setChess = function(x,y)
 {
  person.setChess(x,y);
  machine.setChess();
  chessUI.draw();
  if(board.isGameOver())
  {
   if(person.isVictory()) alert('您獲得了勝利');
   else if(machine.isVictory()) alert('機(jī)器獲得了勝利');
   else alert('游戲結(jié)束，勝負(fù)未分');
  }
 }
 if(Math.floor(Math.random() * 10) % 2)
 {
  alert('機(jī)器執(zhí)棋');
  machine.setChess();
  chessUI.draw();
 }
 else
 {
  alert('您執(zhí)棋');
 }
}
</script>
</body>
</html>

希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。

相關(guān)文章

  • jQuery實(shí)現(xiàn)TAB選項(xiàng)卡切換特效簡(jiǎn)單演示

    jQuery實(shí)現(xiàn)TAB選項(xiàng)卡切換特效簡(jiǎn)單演示

    這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)TAB選項(xiàng)卡切換特效簡(jiǎn)單演示，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2016-03-03
  • jquery實(shí)現(xiàn)網(wǎng)頁(yè)的頁(yè)面平滑滾動(dòng)效果代碼

    jquery實(shí)現(xiàn)網(wǎng)頁(yè)的頁(yè)面平滑滾動(dòng)效果代碼

    這篇文章主要介紹了jquery實(shí)現(xiàn)網(wǎng)頁(yè)的頁(yè)面平滑滾動(dòng)效果代碼,涉及jQuery結(jié)合鼠標(biāo)事件操作頁(yè)面元素滾動(dòng)效果的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-11-11
  • 全面解析DOM操作和jQuery實(shí)現(xiàn)選項(xiàng)移動(dòng)操作代碼分享

    全面解析DOM操作和jQuery實(shí)現(xiàn)選項(xiàng)移動(dòng)操作代碼分享

    這篇文章主要介紹了DOM操作和jQuery實(shí)現(xiàn)選項(xiàng)移動(dòng)操作代碼分享的相關(guān)資料,非常不錯(cuò)具有參考借鑒價(jià)值，需要的朋友可以參考下
    2016-06-06
  • JavaScript實(shí)現(xiàn)的滾動(dòng)公告特效【基于jQuery】

    JavaScript實(shí)現(xiàn)的滾動(dòng)公告特效【基于jQuery】

    這篇文章主要介紹了JavaScript實(shí)現(xiàn)的滾動(dòng)公告特效,結(jié)合完整實(shí)例形式詳細(xì)分析了基于jQuery實(shí)現(xiàn)的頁(yè)面元素間歇修改,最終達(dá)到滾動(dòng)公告效果的相關(guān)操作技巧,需要的朋友可以參考下
    2019-07-07
  • jquery.AutoComplete.js中文修正版(支持firefox)

    jquery.AutoComplete.js中文修正版(支持firefox)

    jquery.AutoComplete.js中文修正版(支持firefox),注意是修正了輸入中文的一些bug,需要的朋友可以測(cè)試下。
    2010-04-04
  • jQuery簡(jiǎn)單實(shí)現(xiàn)input文本框內(nèi)灰色提示文本效果的方法

    jQuery簡(jiǎn)單實(shí)現(xiàn)input文本框內(nèi)灰色提示文本效果的方法

    這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)input文本框內(nèi)灰色提示文本效果的方法,涉及jQuery針對(duì)頁(yè)面元素的遍歷與樣式動(dòng)態(tài)操作技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-12-12
  • jQuery中table數(shù)據(jù)的值拷貝和拆分

    jQuery中table數(shù)據(jù)的值拷貝和拆分

    在開(kāi)發(fā)的過(guò)程中，經(jīng)常會(huì)遇到彈出框顯示前一頁(yè)table列表的情況，這時(shí)候會(huì)有好多方法來(lái)來(lái)解決。下面小編給大家介紹怎么用jquery將值拷貝到第二頁(yè)并拆分拷貝的值，需要的朋友參考下
    2017-03-03
  • js和jQuery設(shè)置Opacity半透明 兼容IE6

    js和jQuery設(shè)置Opacity半透明 兼容IE6

    對(duì)于每一個(gè)網(wǎng)站前端開(kāi)發(fā)人員，常常都會(huì)遇到設(shè)置div透明度的需求，比如在實(shí)現(xiàn)圖片幻燈片切換效果經(jīng)常就需要使圖片淡入淡出。本文分別對(duì)原生js和jQuery在IE和其它瀏覽器中設(shè)置透明度的方法和相關(guān)注意事項(xiàng)進(jìn)行總結(jié)。
    2016-05-05
  • jquery tab插件制作實(shí)現(xiàn)代碼

    jquery tab插件制作實(shí)現(xiàn)代碼

    jquery插件豐富，很多都是很好用的，最近學(xué)習(xí)了一下如何制作jquery插件，發(fā)現(xiàn)jquery插件制作其實(shí)很簡(jiǎn)單，這里介紹一下。
    2010-06-06
  • jQuery Dom元素操作技巧

    jQuery Dom元素操作技巧

    DOM是一種與瀏覽器、平臺(tái)、語(yǔ)言無(wú)關(guān)的接口，使用該接口可以輕松訪問(wèn)頁(yè)面中所有的標(biāo)準(zhǔn)組件,這篇文章給大家介紹了jquery dom元素操作方法，需要的朋友參考下
    2018-02-02

最新評(píng)論