js 过滤非法字符,只输入数字,文本框长度限制

最新推荐文章于 2022-06-13 21:42:06 发布

WDYDXF

最新推荐文章于 2022-06-13 21:42:06 发布

阅读量4.2k

点赞数

分类专栏： Javascript 文章标签： javascript

本文链接：https://blog.csdn.net/WDYDXF/article/details/38091043

版权

Javascript 专栏收录该内容

29 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <title>动画编辑页面EZ602230847CN</title>
    <script src="AnimationResource/jsDevelop/jquery-2.0.3.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("body").on("keyup", ".pValidLength,.pValidPositiveFloat,.pValidForbidSpecialCharacter", function (eve) {
                var target = $(eve.target);
                //                alert(length);
                if (target.hasClass("pValidLength")) {
                    var length = parseInt(target.attr("plength"));
                    if (!length) {
                        alert("缺少plength属性");
                        return false
                    }
                    //除了字母,数字,   其他按键不计算在内
                    if (eve.keyCode < 48 || ((57 < eve.keyCode) && (eve.keyCode < 65)))
                        return;
                    if (((90 < eve.keyCode) && (eve.keyCode < 96)))
                        return;
                    if (((105 < eve.keyCode) && ((eve.keyCode != 110) && (eve.keyCode != 190) && (eve.keyCode != 229))))
                        return;

                    if ($.trim(target.val()).length > (length - 1)) {
                        //                        alert("输入字符超过范围");
                        target.val($.trim(target.val()).substring(0, length));
                    }
                }

                if (target.hasClass("pValidPositiveFloat")) {
                    //                    console.log(/^\d+[.]?\d*/.exec($(target).val()));
                    $(target).val(/^\d+[.]?\d*/.exec($(target).val()));
                }
                if (target.hasClass("pValidForbidSpecialCharacter")) {
                    var pattern = new RegExp("[`~!@#$^&*()=-_|{}':;',\\[\\].<>/?~！@#￥……&*（）&;|{}【】‘；：”“'。，、？]");

                    $(target).val($(target).val().replace(pattern, ''));
                }
            });

            //            $(".pValidLength").blur(function () {
            //                alert('sdf');
            //            });

            $("[type=button]").click(function (event) {
                switch (event.target.attributes.value.value) {
                    case "增加1输入框":
                        $("body").append('文本长度:<input type="text" class="pValidLength" />');
                        break;

                    case "增加2输入框":
                        $("body").append('只能输入正数:<input type="text" class="pValidPositiveFloat" />');
                        break;

                    case "增加3输入框":
                        $("body").append('特殊字符禁止输入<input type="text" class="pValidForbidSpecialCharacter" />');
                        break;
                }
            });
        });
    </script>
</head>
<body>
    文本长度:<input type="text" class="pValidLength" plength="7" />
    只能输入正数:<input type="text" class="pValidPositiveFloat pValidLength" plength="5" />
    特殊字符禁止输入
    <input type="text" class="pValidForbidSpecialCharacter" />
    <input type="button" value="增加1输入框" />
    <input type="button" value="增加2输入框" />
    <input type="button" value="增加3输入框" />
</body>
</html>