<p>效果图，从右往下，再往左排序，类似以前的书籍念法。</p><p><img src="http://img.li6.cc/content_img/1/article/123/781139521530599.png" alt="" /></p><p>最大格子64<br /></p><p>for循环 i: 0 - 63</p><p>取出 i 相对于右边的排序</p><p>即可。</p><p>上代码</p><p></p><pre><pre style="background-color:#2b2b2b;color:#a9b7c6;font-family:'宋体';font-size:9.6pt;"><script> $(function () { var maxDushu = 8; var maxTd = 4;//最大列数 var maxTr = 8;//最大行数 var allTds = maxTd * maxTr;//一共有几个TD var allDushu = []; var dushuI; for(dushuI = 0.25; dushuI<=maxDushu; dushuI +=0.25) { allDushu.push(dushuI); } //dushu 12, TdIndex 0/1/2 //TdIndex 转 度数index : 按右下左下的顺序 即是 TD的列 * 8 -TD所在行 function getTdDushu(TdIndex) { var TdRightLie = (TdIndex) % maxTd ; TdRightLie = maxTd - TdRightLie - 1; //Td从右往左数 在第几列 //包含当前TD var TdHang = (TdIndex) / maxTd; TdHang = parseInt(TdHang); var dushuIndex = (TdRightLie+1) * maxTr - (maxTr - TdHang); return typeof allDushu[dushuIndex] != 'undefined' ? allDushu[dushuIndex] : '-'; } function getTdDushu2(TdIndex) { var TdleftLie = (TdIndex) % maxTd ; //Td从右往左数 在第几列 //包含当前TD var TdHang = (TdIndex) / maxTd; TdHang = parseInt(TdHang); var dushuIndex = (TdleftLie+1) * maxTr - (maxTr - TdHang); return typeof allDushu[dushuIndex] != 'undefined' ? allDushu[dushuIndex] : '-'; } var table = '<table width="500">'; table += '<tr>'; var i; for (i=0; i < allTds; i++) { table += '<td>'+ getTdDushu(i) +'</td>'; if( (i+1) % maxTd ==0) table += '</tr><tr>'; } var table2 = '</table>'; table2 = '<table width="500">'; table2 += '<tr>'; var i; for (i=0; i < allTds; i++) { table2 += '<td>'+ getTdDushu2(i) +'</td>'; if( (i+1) % maxTd ==0) table2 += '</tr><tr>'; } table2 += '</table>'; $('#show').append(table).append(table2); }) </script> </pre></pre> <br /><p></p>