JS验证及错误调试

/*
try 语句测试代码块的错误。
catch 语句处理错误。
throw 语句创建自定义错误。
finally 语句在 try 和 catch 语句之后，无论是否有触发异常，该语句都会执行。
调试：
debugger 关键字
debugger 关键字用于停止执行 JavaScript，并调用调试函数。
这个关键字与在调试工具中设置断点的效果是一样的。
console.log() 方法
如果浏览器支持调试，你可以使用 console.log() 方法在调试窗口上打印。
*/

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script>
            /*
                try 语句测试代码块的错误。
                catch 语句处理错误。
                throw 语句创建自定义错误。
                finally 语句在 try 和 catch 语句之后，无论是否有触发异常，该语句都会执行。
                调试：
                debugger 关键字
                debugger 关键字用于停止执行 JavaScript，并调用调试函数。
                这个关键字与在调试工具中设置断点的效果是一样的。
                console.log() 方法
                如果浏览器支持调试，你可以使用 console.log() 方法在调试窗口上打印。
            */
        </script>
        <p>请输入 1 到 10 之间的数字：</p>
        <input id="numb">
        <button type="button" onclick="myFunction()">提交</button>
        <p id="demo"></p>
        <input id="id1" type="number" min="100" max="300" required>
        <button onclick="myFunction1()">验证</button>
        <p id="demow"></p>
        <script>
        function myFunction1() {
            var inpObj = document.getElementById("id1");
            if (inpObj.checkValidity() == false) {
                document.getElementById("demow").innerHTML = inpObj.validationMessage;
            }
        }
            function myFunction() {
                var x, text;
                // 获取 id="numb" 的值
                x = document.getElementById("numb").value;
                // 如果输入的值 x 不是数字或者小于 1 或者大于 10，则提示错误 Not a Number or less than one or greater than 10
                if (isNaN(x) || x < 1 || x > 10) {
                    text = "输入错误";
                } else {
                    text = "输入正确";
                }
                document.getElementById("demo").innerHTML = text;
            }
        </script>
    </body>
</html>

 

posted @ 2022-11-23 20:21  山君与见山  阅读(100)  评论(0)  编辑  收藏  举报