ajax方法写一个在线斗地主的游戏，第一章-开发前的准备工作

很久以前就在思考用ajax实现一个游戏功能的程序，朋友说你做一个斗地主的游戏吧，于是在他们的怂恿之下我开始着手用js来实现。

这里实现的是三人斗地主.

首先我们是用ajax方法与服务器交换数据的，所以学要一个创建ajax对象的方法：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32

//AJAX var http_request = false; function send_request(url) { http_request = false; if (window.XMLHttpRequest) { http_request = new XMLHttpRequest(); if (http_request.overrideMimeType) { http_request.overrideMimeType('text/xml'); } } else if (window.ActiveXObject) { try { http_request = new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { try { http_request = new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {} } } if (!http_request) { alert('不能创建 XMLHttpRequest 对象!'); return false; } http_request.onreadystatechange = processRequest; http_request.open('GET', url, true); http_request.send(null); } //处理返回信息 var type = 0; function send_r(url,t){ type = t; send_request(url); }

这里有两个函数 send_request完成创建http_request对象，send_r调用这个函数，参数type暂时不用管。在send_request中，http_request.onreadystatechange = processRequest;的作用是将服务器返回的数据交给processRequest函数处理。

processRequest函数是这样定义的：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

function processRequest() { if (http_request.readyState == 1) { //alert('正在连接'); //document.getELementById('network_status').innerHTML = '正在连接..'; } if (http_request.readyState == 4) { if (http_request.status == 200) { if(type == 0){ var text = http_request.responseText.split("|"); player1_name = text[0]; player2_name = text[1]; player3_name = text[2]; flag1=text[25]; lord = text[6]; lord_p = text[7]; flag = text[8]; beishu=text[26]; self_var= text[3];//本人手中牌的序列 player1_show = text[9]; player2_show = text[10]; player3_show = text[11]; wininfo=text[28]; expectlord=text[24]; if(status != 'wait'){ do_ani1_p(text[4]); do_ani2_p(text[5]); do_self_p(text[3]); do_lord_p(text[7]); } self_ok=text[27]; do_user_info(text[12], text[13], text[14], text[15], text[16], text[17],text[18],text[19],text[20],text[21],text[22],text[23]); } } } }

var text = http_request.responseText.split("|"); 这句是接收服务器返回的字符串，这个字符串包含很多不同的数据，每个数据之间是用|隔开的，因此我们用split将其分割成数组，当然，要使用这些数据还得记住在后台的约定：每个数据代表什么意思。如

1 2 3

player1_name = text[0]; player2_name = text[1]; player3_name = text[2];

表示玩家1（player1_name）的在本次斗地主中的名字是 text[0]。

接下来又几个很重要的地方：

1 2 3 4

do_ani1_p(text[4]); do_ani2_p(text[5]); do_self_p(text[3]); do_lord_p(text[7]);

do_ani1_p，do_ani2_p处理当前玩家的另外两个玩家的牌在自己页面上的显示。do_self_p显示自己的牌，do_lord_p显示地主牌。

最后，既然是斗地主，当然还需要制定斗地主的规则，我们需要用js来实现它，上代码：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164

//规则 function pai_v(pai){ var v; if(pai == '3' || pai == 'F3' || pai == 'T3' || pai == 'H3') v = 3; if(pai == '4' || pai == 'F4' || pai == 'T4' || pai == 'H4') v = 4; if(pai == '5' || pai == 'F5' || pai == 'T5' || pai == 'H5') v = 5; if(pai == '6' || pai == 'F6' || pai == 'T6' || pai == 'H6') v = 6; if(pai == '7' || pai == 'F7' || pai == 'T7' || pai == 'H7') v = 7; if(pai == '8' || pai == 'F8' || pai == 'T8' || pai == 'H8') v = 8; if(pai == '9' || pai == 'F9' || pai == 'T9' || pai == 'H9') v = 9; if(pai == '10' || pai == 'F10' || pai == 'T10' || pai == 'H10') v = 10; if(pai == '11' || pai == 'F11' || pai == 'T11' || pai == 'H11') v = 11; if(pai == '12' || pai == 'F12' || pai == 'T12' || pai == 'H12') v = 12; if(pai == '13' || pai == 'F13' || pai == 'T13' || pai == 'H13') v = 13; if(pai == '1' || pai == 'F1' || pai == 'T1' || pai == 'H1') v = 14; if(pai == '2' || pai == 'F2' || pai == 'T2' || pai == 'H2') v = 15; if(pai == 'JOKE1') v = 16; if(pai == 'JOKE2') v = 17; if(pai == 'NO') v = 0; return v; } function pai_a(pai){ //return 1; var split_pai = pai.split(","); var pai_num = split_pai.length - 1; var count = new Array(1,1,1,1,1,1,1,1,1,1,1,1); var k = 0; for(var i = 1;i < pai_num;i ++)// { if(pai_v(split_pai[i]) == pai_v(split_pai[i - 1]))//如果是相同的，因为牌是按照从小到大的顺序排列的，所以如果是对子都是挨着的。 count[k] ++; else k ++; } var r = ''; for(var i = 0;i < count.length;i ++) { r += count[i]+","; } //对 if(pai_num == 2 && r == '2,1,1,1,1,1,1,1,1,1,1,1,') return pai_c(pai_v(split_pai[0]), pai_num, 'dui'+pai_v(split_pai[0])); //三只 if(pai_num == 3 && r == '3,1,1,1,1,1,1,1,1,1,1,1,') return pai_c(pai_v(split_pai[0]), pai_num, 'san'); //四只 if(pai_num == 4 && r == '4,1,1,1,1,1,1,1,1,1,1,1,') return pai_c(pai_v(split_pai[0]), pai_num, 'zha'); //四带二只 if(pai_num == 6 && (r == '4,1,1,1,1,1,1,1,1,1,1,1,' || r == '1,4,1,1,1,1,1,1,1,1,1,1,' || r == '1,1,4,1,1,1,1,1,1,1,1,1,')) { if(count[0] == 4) return pai_c(pai_v(split_pai[3]), pai_num, 'sidaier'); else if(count[1] == 4) return pai_c(pai_v(split_pai[4]), pai_num, 'sidaier'); else if(count[2] == 4) return pai_c(pai_v(split_pai[5]), pai_num, 'sidaier'); } //四带二对 if(pai_num == 8 && (r == '4,2,2,1,1,1,1,1,1,1,1,1,' || r == '2,4,2,1,1,1,1,1,1,1,1,1,' || r == '2,2,4,1,1,1,1,1,1,1,1,1,')) { if(count[0] == 4) return pai_c(pai_v(split_pai[3]), pai_num, 'sidailiangdui'); else if(count[1] == 4) return pai_c(pai_v(split_pai[5]), pai_num, 'sidailiangdui'); else if(count[2] == 4) return pai_c(pai_v(split_pai[7]), pai_num, 'sidailiangdui'); } //三带一 if(pai_num == 4 && (r == '3,1,1,1,1,1,1,1,1,1,1,1,' || r == '1,3,1,1,1,1,1,1,1,1,1,1,')) { if(count[0] > count[1]) return pai_c(pai_v(split_pai[2]), pai_num, 'sandaiyi'); else return pai_c(pai_v(split_pai[3]), pai_num, 'sandaiyi'); } //三带二 if(pai_num == 5 && (r == '3,2,1,1,1,1,1,1,1,1,1,1,' || r == '2,3,1,1,1,1,1,1,1,1,1,1,')) { if(count[0] > count[1]) return pai_c(pai_v(split_pai[2]), pai_num, 'sandaiyidui'); else return pai_c(pai_v(split_pai[4]), pai_num, 'sandaiyidui'); } //连对 if((pai_num == 6 && r == '2,2,2,1,1,1,1,1,1,1,1,1,') || (pai_num == 8 && r == '2,2,2,2,1,1,1,1,1,1,1,1,') || (pai_num == 10 && r == '2,2,2,2,2,1,1,1,1,1,1,1,') || (pai_num == 12 && r == '2,2,2,2,2,2,1,1,1,1,1,1,') || (pai_num == 14 && r == '2,2,2,2,2,2,2,1,1,1,1,1,') || (pai_num == 16 && r == '2,2,2,2,2,2,2,3,1,1,1,1,') || (pai_num == 18 && r == '2,2,2,2,2,2,2,2,2,1,1,1,') || (pai_num == 20 && r == '2,2,2,2,2,2,2,2,2,2,1,1,')) { var flag = 0; for(var i = 2;i < pai_num;i += 2) { if(pai_v(split_pai[i]) - pai_v(split_pai[i - 1]) != 1) { flag = 1; break; } } if(flag == 0){ return pai_c(pai_v(split_pai[pai_num - 1]), pai_num, 'liandui'); } } //飞机 if((pai_num == 3+3+2 && (r == '3,3,2,1,1,1,1,1,1,1,1,1,' || r == '2,3,3,1,1,1,1,1,1,1,1,1,')) || (pai_num == 3+3+2+2 && (r == '3,3,2,2,1,1,1,1,1,1,1,1,' || r == '2,3,3,2,1,1,1,1,1,1,1,1,' || r == '2,2,3,3,1,1,1,1,1,1,1,1,')) || (pai_num == 3+3+1+1 && (r == '3,3,1,1,1,1,1,1,1,1,1,1,' || r == '1,3,3,1,1,1,1,1,1,1,1,1,' || r == '1,1,3,3,1,1,1,1,1,1,1,1,'))) { if(count[0] == 3 && count[1] == 3 && pai_v(split_pai[3]) - pai_v(split_pai[2]) == 1) return pai_c(pai_v(split_pai[3]), pai_num, 'feiji');//3322,3311,332 if(count[0] == 2 && count[1] == 3 && pai_v(split_pai[5]) - pai_v(split_pai[4]) == 1) return pai_c(pai_v(split_pai[5]), pai_num, 'feiji');//2332,233 if(count[0] == 1 && count[1] == 3 && pai_v(split_pai[4]) - pai_v(split_pai[3]) == 1) return pai_c(pai_v(split_pai[4]), pai_num, 'feiji');//1331 if(count[0] == 2 && count[1] == 2 && pai_v(split_pai[7]) - pai_v(split_pai[6]) == 1) return pai_c(pai_v(split_pai[7]), pai_num, 'feiji');//2233 if(count[0] == 1 && count[1] == 1 && pai_v(split_pai[5]) - pai_v(split_pai[4]) == 1) return pai_c(pai_v(split_pai[5]), pai_num, 'feiji');//1133 } //对王 if(pai_num == 2 && ((pai_v(split_pai[0]) == 16 && pai_v(split_pai[1]) == 17) || (pai_v(split_pai[0]) == 17 && pai_v(split_pai[1]) == 16))) return pai_c(100, pai_num, 'wangzha'); //单 if(pai_num == 1) return pai_c(pai_v(split_pai[0]), pai_num, pai_v(split_pai[0])); //顺子 if(pai_v(split_pai[pai_num - 1]) <= pai_v(1) && pai_num >= 5 && r == '1,1,1,1,1,1,1,1,1,1,1,1,') { var flag2 = 0; for(var i = 1;i < pai_num;i ++) { if(pai_v(split_pai[i]) - pai_v(split_pai[i - 1]) != 1) { flag2 = 1; break; } } if(flag2 == 0) return pai_c(pai_v(split_pai[pai_num - 1]), pai_num, 'shunzi'); } return Array(0,0,0); } function pai_c(v,num, t){ var arr = new Array(); arr[0] = v; arr[1] = num; arr[2] = t; return arr; } //-----------END

这是开始之前的准备工作。以后的代码中我们会反复用到刚刚介绍的片段。

这篇文章还发表在http://jcodecraeer.com/a/jquery_js_ajaxjishu/2012/0602/224.html，同步更新请关注