SKY外语计算机学习

标题: 听了小耳朵的课,写了个汉诺塔的网页版 [打印本页]

作者: rogan    时间: 2012-5-25 21:50
标题: 听了小耳朵的课,写了个汉诺塔的网页版
本帖最后由 rogan 于 2012-5-25 22:20 编辑

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <html>
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html; charset=utf8">
  5.         <title>Untitled Document</title>
  6.         <script src="lib/jquery/jquery-1.4.2.js">
  7.         </script>
  8.         <script language="JavaScript">
  9.             $(document).ready(function(){
  10.                 n = 5;
  11.                
  12.                 for (i = 0; i < n; i++) {
  13.                     $("th:eq(0)").append("<div class='wh" + (n-i) + "'>"+(n-i)+"</div>")
  14.                     
  15.                 }
  16.                 for (i = 0; i < n; i++) {
  17.                     $(".wh" + i).css({"width": 30 * (i + 1) + "px","margin": "0 auto"});
  18.                 }
  19.                
  20.                
  21.                 hannuota(n, 'A', 'B', 'C');
  22.                
  23.                 function hannuota(n, A, B, C){
  24.                     if (1 == n) {
  25.                       alert("将编号为" + n + "的盘子直接从" + A + "柱子移到" + C + "柱子\n");
  26.                                                 $tmp = $("div.wh"+(n));
  27.                                                 $tmp.remove();
  28.                                                 $("th."+C).append($tmp)
  29.                     }
  30.                     else {
  31.                         hannuota(n - 1, A, C, B);
  32.                         alert("将编号为" + n + "的盘子直接从" + A + "柱子移到" + C + "柱子\n");
  33.                                                 $tmp1 = $("div.wh"+(n));
  34.                                                 $tmp1.remove();
  35.                                                 $("th."+C).append($tmp1)
  36.                         hannuota(n - 1, B, A, C);
  37.                     }
  38.                 }
  39. //                alert(str);
  40.             })
  41.         </script>
  42.         <style>
  43.             tr {
  44.                 border: 1px solid #00ff00;
  45.             }
  46.             
  47.             th {
  48.                 width: 200px;
  49.                 height: 300px;
  50.                 vertical-align: top;
  51.                 border: 1px solid #000;
  52.                 text-align: center
  53.             }
  54.             
  55.             div {
  56.                 height: 20px;
  57.                 background: red;
  58.                 margin: 3px;
  59.             }
  60.         </style>
  61.     </head>
  62.     <body>
  63.         <table>
  64.             <tr class="one">
  65.                 <th class="A">
  66.                     A
  67.                 </th>
  68.                 <th class="B">
  69.                     B
  70.                 </th>
  71.                 <th class="C">
  72.                     C
  73.                 </th>
  74.             </tr>
  75.            
  76.         </table>
  77.     </body>
  78. </html>
复制代码

作者: rogan    时间: 2012-5-25 21:52
这个本来是便于自己理解汉诺塔的,发出来供大家讨论下,也是自己练习jquery
作者: rogan    时间: 2012-5-25 21:57
我的火狐浏览器能够运行
作者: 流氓    时间: 2012-5-26 01:20
本帖最后由 sky_yx 于 2015-12-30 14:15 编辑

你比我快,我java还没有写出来


作者: rogan    时间: 2012-5-26 17:33
我以前就看了汉诺塔的,加上jquery本来就简单,你的代码写好了也让我学习下
作者: SKY定格    时间: 2012-6-2 09:22
本帖最后由 sky_yx 于 2015-12-30 14:15 编辑

为什么我打开就三个框框没有盘子呢


作者: rogan    时间: 2012-6-2 17:48
可以到演示地址查看效果,看那个帖子




欢迎光临 SKY外语计算机学习 (http://www.skywj.com/) Powered by Discuz! X2.5