javascript五子棋游戏制作（-）

闲着无事，使用jquery和js写写五子棋游戏，帮各位拍砖呀。

准备工作：

下载jQuery包。

1、制作房间：

Jsp页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>


<%
	String path = request.getContextPath();
%>

2、写Js代码

/**
 * 房间
 * @author ps
 * @create 2012-10-27 12:40:57
 */
//解决与其它JS包冲突的问题。
var jq = jQuery.noConflict();

//房间
Room = function (){
	//room本身
	//var ROOMTHIS = this;
	
	//桌子
	this.deskList = new Array(20);
	var roomCss = new RoomCss();
	
	//初始化房间的20张桌子，并赋以桌子号。
	this.initDesk = function(){
		
		var size = this.deskList.length;
		for ( var row = 0; row < size; row++) {
			var desk1 = new Desk();
			desk1.deskId = "Desk_" + (row + 1);
			this.deskList[row] = desk1;
		}
		
	};
	
	//显示房间
	this.displayRoom = function(){
		var mainDiv = jq("
");
		
		var northDiv = jq("
您好,我是房间一号呀！
");
		northDiv.css(roomCss.northDivCss());
		
		
		var centerDiv = jq("
");
		centerDiv.css(roomCss.centerDivCss());
		
		var table = jq("");
		table.css(roomCss.tableCss());
		
		var tr = jq("");
		var desk = this.deskList;
		for ( var row = 0; row < desk.length; row++) {
			
			var td = jq("");
			var tab = jq("");
			tab.attr("id",desk[row].deskId);
			tab.append("");
			tab.append(""+desk[row].deskId+"");
			
			
			td.append(tab);
			tr.append(td);
			
			if((row + 1) % 5 == 0 && row != 0){
				table.append(tr);
				tr = jq("");
			}
			
			if(row == (desk.length -1)){
				table.append(tr);
			}
		}
		
		centerDiv.append(table);
		
		mainDiv.append(northDiv);
		mainDiv.append(centerDiv);
		
		jq("body").append(mainDiv);
	};
};

//房间的Css样式
RoomCss = function(){
	//标题的样式
	this.northDivCss = function(){
		var css = {
				color : "#33CCFF",
				textAlign : "center",
				fontWeight : "bold",
				fontFamily : "微软雅黑 Candara 'Times New Roman'",
				fontSize : "34px"
		};
		return css;
	};
	//桌子的样式
	this.centerDivCss = function(){
		var lef = (window.screen.availWidth)/8;
		var css = {
				backgroundColor : "#99CCCC",
				position : "absolute",
				left : lef,
				textAlign : "center",
				fontWeight : "bold",
				fontFamily : "微软雅黑 Candara 'Times New Roman'",
				fontSize : "20px"
		};
		return css;
	};
	this.tableCss = function(){
		var css = {
				textAlign : "center",
				fontWeight : "bold",
				fontFamily : "微软雅黑 Candara 'Times New Roman'",
				fontSize : "20px",
				tableLayout : "fixed"
		};
		return css;
	};
};

//桌子
Desk = function(){
	//桌子编号
	this.deskId = "";
	//玩家1
	this.player1 = "";
	//玩家2
	this.player2 = "";
	//是否退出
	this.isExit = true;
	//是否开始
	this.isStart = false;
};

jq(document).ready(function(){
	var room = new Room();
	room.initDesk();
	room.displayRoom();
});

在这篇中，先不再解释，希望大家看看后，给个建议。我再去一步一步解释 。。