qq_28390875 2016-08-12 06:34 采纳率: 0%
浏览 1038
已结题

这个用JavaScript怎么做

学生随机程序
要求：
1. 可动态输入行数和列数生成座位表
2. 座位表上有座位号（序号或者几排几列）
3. 可以在输入框中指定随机个数，随机挑选，并使相应个数的座位表上背景色变红色
4. 随机的过程中有动态闪动效果
5. 动态闪动效果逐渐变慢直至停止并显示结果

  • 写回答

2条回答 默认 最新

  • 当作看不见 2016-08-12 10:45
    关注

    变色动画效果要jQuery-UI才支持,去重算法,自己改一下(是在是不难,或者直接每次random的值设为1,一个一个的生成)

     <!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <script src="js/jquery-2.0.0.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function(){
            var row=$('#row').val();
            var col=$('#col').val();
            var random=$("#random").val();


            var choose=$("td");
            $('#createtable').click(function(){
                $("td").remove();
                $("tr").remove();
                for(var i=1;i<=col;i++){
                    $("table").append("<tr></tr>")
                    for (var j=1;j<=row;j++) {
                        $('table tr:last-child').append("<td>第"+i+"行第"+j+"列</td>");

                    }
                }


            })

            var num=new Array(random);
            for(var j=0;j<num.length;j++){
                num[j]=-1;
            }
            var choose;     
            $("#input").bind("click",function(){
                    for (var i=1;i<=random;i++) {
                        var row1=Math.ceil(Math.random()*row);
                        var col1=Math.ceil(Math.random()*col);
                        choose=(row1-1)*(row-1)+col1;
                        console.log($("td:eq("+choose+")").text());
                        $("td:eq("+choose+")").addClass("red");

                        //动画变色的需要用jQuery-UI插件才可以,jQuery不支持
                        //去重算法,自己完善一下,随机数去重,
//                      for (var k=0;k<num.length;k++) {
//                          if(num[k]==-1){
//                              num[k]=choose;
//                              $("td:eq("+choose+")").addClass("red");
//                          }
//                          else if(choose==num[k]){
//                              i-=1;
//                              break;
//                          }
//                          
//                      }
                    }
            })
        })
    </script>
    <style type="text/css">
    td{
        background-color: greenyellow;
    }
    .red{
        background-color: red;
        opacity: 1;
    }
    table{
        background-color: red;
    }
    </style>
    <body>
        列:<input type="text" name="" id="row" value="10" />
        行:<input type="text" name="" id="col" value="10" />
        <button id="createtable">create</button>
        随机挑选：<input type="text" id="random" value="1"/>

        <button id="input">随机挑选</button>
        <table border="1" cellspacing="0" cellpadding="15px">
        </table>
    </body>
</html>
    评论

报告相同问题？

悬赏问题

  • ¥20 有偿：在ubuntu上安装arduino以及其常用库文件。
  • ¥15 请问用arcgis处理一些数据和图形，通常里面有一个根据点划泰森多边形的命令，直接划的弊端是只能执行一个完整的边界，但是我们有时候会用到需要在有很多边界内利用点来执行划泰森多边形的命令
  • ¥30 在wave2foam中执行setWaveField时遇到了如下的浮点异常问题，请问该如何解决呢？
  • ¥20 看图片）删除这个自动化录屏脚本就一直报错找不到脚本文件，如何解决？（相关搜索：bat文件）
  • ¥750 关于一道数论方面的问题，求解答！(关键词-数学方法)
  • ¥200 csgo2的viewmatrix值是否还有别的获取方式
  • ¥15 Stable Diffusion，用Ebsynth utility在视频选帧图重绘，第一步报错，蒙版和帧图没法生成，怎么处理啊
  • ¥15 请把下列每一行代码完整地读懂并注释出来
  • ¥15 pycharm运行main文件，显示没有conda环境
  • ¥15 寻找公式识别开发，自动识别整页文档、图像公式的软件