小懿同学要努力 2023-09-27 18:47 采纳率: 0%
浏览 4

js限定输入内容代码运行不了找不到错误

不知道为什么代码运行不了?说是正则表达式错误


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        input[type=text]{width:40px;border-color: #bbb;height: 25px;font-size: 14px;border-radius: 2px;outline: 0;border: #ccc 1px solid;padding: 0 10px;-webkit-transition: box-shadow .5s;margin-bottom: 15px;}
        input[type=text]:hover,input[type=text]:focus,input[type=submit]:hover{border: 1px solid #56b4ef; box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 0 8px rgba(82,168,236,.6); -webkit-transition: box-shadow .5s;}
        input::-webkit-input-placeholder {color: #999; -webkit-transition: color .5s;}
        input:focus::-webkit-input-placeholder, input:hover::-webkit-input-placeholder {color: #c2c2c2; -webkit-transition: color .5s;}
        input[type=submit]{height: 30px; width: 80px; background:#4393C9; border:1px solid #fff;color: #fff;font:14px bolder;}        
        #result{background: #56b4ef;width: 300px;height: 50px;}
    </style>
    <title>正则表达式</title>
</head>
<body>
    <form id="form">
        年份<input type="text" name="year">
        月份<input type="text" name="month">
        <input type="submit" value="查询">
    </form>
    <div id="result"></div>
    
    <script>
        function checkYear(obj){
            if(!obj.value.match(/^0/)){
                obj.style.borderColor = 'red';
                result.innerHTML = '输入错误,年份为4位数字表示';
                return false;
            }
            result.innerHTML = '';
            return true;
        }
        
        function checkMonth(obj){
            if(!obj.value.match(/^((0?[1-9])|(1[012]))$/)){
                obj.style.borderColor = 'red';
                result.innerHTML = '输入错误,月份为1~12之间';
                return false;
            }
            result.innerHTML = '';
            return true;
        }
        
        var form = document.getElementById('form');
        var result = document.getElementById('result');
        var input = document.getElementsByTagName('input');
        form.onsubmit = function(){
            return checkYear(inputs.year) && checkMonth(inputs.month);
        };
        inputs.year.onfocus = function(){
            this.style.borderColor = '';
        };
        inputs.month.onfocus = function(){
            this.style.borderColor = '';
        };
        if(!String.prototype.trim){
            String.prototype.trim = function(){
                return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF]\xA0$+/);
            };
        }
        input.year.onblur = function(){
            this.value = this.value.trim();
            checkYear(this);
        };
        input.month.onblur = function(){
            this.value = this.value.trim();
            checkMonth(this);
        };
    </script>
</body>
</html>


应该是下图所示

img

  • 写回答

3条回答 默认 最新

  • CSDN-Ada助手 CSDN-AI 官方账号 2023-09-27 20:44
    关注

    【相关推荐】




    如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^
    评论

报告相同问题?

问题事件

  • 修改了问题 9月27日
  • 创建了问题 9月27日