九九乘法表的升级版

最新推荐文章于 2021-11-09 16:13:11 发布

MrLc666

最新推荐文章于 2021-11-09 16:13:11 发布

阅读量10w+

点赞数 1

分类专栏： C# 文章标签： C#

本文章博主原创，希望对你有所帮助。

本文链接：https://blog.csdn.net/sakenc/article/details/96358074

版权

C# 专栏收录该内容

20 篇文章 0 订阅

订阅专栏

乘法口诀表；其实，乘法口诀表也可通过for循环控制制作，下面，教您如何乘法口诀表，很快就制作出来啦！

一、执行步骤说明：

第一步：给num赋初始值
第二步：判断是否成立，
如果返回值TRUE，则进行循环体内输出操作
　　　　如果返回值FALSE，则提示请输入一个值吧...

第三步：返回值为TRUE时，num进行++，否则不执行。
第四步：返回值为TRUE时，继续下一次num循环判断。

二、具体实现：

三、案例源码：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <title>九九乘法表</title>
    <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
    <style>
        * {
            padding: 0;
            margin: 0;
        }

        a {
            text-decoration: none;
            color: #fff;
        }

        ul, li {
            list-style: none;
        }

        td {
            padding: 5px 10px;
            border: 1px solid #ccc;
            background: #111;
            color: #fff;
            white-space: nowrap;
        }

        body {
            font-size: 12px;
            font-family: "微软雅黑";
            padding: 20px;
        }
    </style>
</head>
<body>

    <input type="text" value="9" id="num" />
    <input type="button" onclick="result()" value="生成乘法表" />
    <input type="button" onclick="startResult()" value="自动生成" />
    <input type="button" onclick="clearResult()" value="停止生成" />

    <table id="tab">
        <tbody id="tbody"></tbody>
    </table>

    <script type="text/javascript">
        function result() {
            var num = document.getElementById("num").value;
            if (!num) {
                document.getElementById("num").focus();
                alert("请输入一个值吧...");
                return;
            }
            if (isNaN(num)) {
                document.getElementById("num").focus();
                alert("请输入一个数字吧...");
                return;
            }
            var html = "";
            for (var i = 1; i <= num; i++) {//外层循环就控制里面循环的次数
                html += "<tr>";
                for (var j = 1; j <= i; j++) {
                    html += "<td>" + j + " * " + i + " = " + (i * j) + "</td>";
                }
                html += "</tr>";
            };
            document.getElementById("tbody").innerHTML = html;
        }

        var timer = null;
        var num = 0;
        function startResult() {
            timer = setInterval(function () {
                num++;
                document.getElementById("num").value = num;
                result();
            }, 600);
        }

        function clearResult() {
            clearInterval(timer);
            //num = 0;
        };
    </script>
</body>
</html>

MrLc666

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
九九乘法表的升级版

乘法口诀表；其实，乘法口诀表也可通过for循环控制制作，下面，教您如何乘法口诀表，很快就制作出来啦！一、执行步骤说明：第一步：给num赋初始值第二步：判断是否成立，如果返回值TRUE，则进行循环体内输出操作　　　　如果返回值FALSE，则提示请输入一个值吧...第三步：返回值为TRUE时，num进行++，否则不执行。第四步：返回值为TRUE时，继...
复制链接

扫一扫

专栏目录