只允许输入正常数字,过滤多个小数点和字符,去除第二个小数点

最新推荐文章于 2023-04-11 08:43:07 发布

前端酱紫

最新推荐文章于 2023-04-11 08:43:07 发布

阅读量616

点赞数 1

分类专栏： JavaScript高级文章标签： javascript

本文链接：https://blog.csdn.net/wuj1935/article/details/119923098

版权

项目记一笔同时被 2 个专栏收录

46 篇文章 3 订阅

订阅专栏

JavaScript高级

28 篇文章 1 订阅

订阅专栏

只允许输入正常数字,过滤多个小数点和字符,去除第二个小数点

使用场景：
在input输入内容的时候，可以使用这个方法限制用户只能输入正常数字，
要是输入了字母多个小数点都会被处理成正常的数字

js新手版非正则匹配


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function changeinput(val = '') {
            let nums = Array.from(val);; //  转化成数组
            let numsArrs = [];
            let flag = false; // 设置一个开关
            nums.forEach(function (res) { // 循环 输入的值
                let r = Number(res); // 转化成number 
                if (res === '.') { // 是否包含 小数点
                    if (flag == false) { // 小数点只取第一次
                        numsArrs.push(res) // 把小数点push到数组里
                        flag = true // 有了小数点 把开关 关闭
                    }
                } else if (!isNaN(r)) {
                    numsArrs.push(res) // 该元素是一个数字 就push到数组里
                }
            });
            return numsArrs.join('') * 1 || 0 // 把所有数字和小数点拼接起来转化成数字
        }
        console.log(changeinput('A11F.,2w2.3a3')); //11.2233
        console.log(changeinput('A666F')); // 666
        console.log(changeinput('')); // 0
        console.log(changeinput('.aa88cc')); // 0.88
        console.log(changeinput('啊的.aa99的cc')); // 0.88
    </script>

</body>

</html>

无注简洁版释版：


<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function changeInput(val = '') {
            let nums = val.replace(/[^\d.]/g, "");
            let arrs = nums.split(".") || []
            if (arrs.length > 2) {
                nums = [arrs.splice(0, 1).join(''), '.', arrs.join('')].join('')
            }
            arrs = nums.split(".") || [];
            arrs.length >= 2 ? Number(arrs[1]) == 0 || Number(arrs[1]) == "" && (nums = arrs[0]) : nums
            return +nums || 0;
        }
        console.log(changeInput('0A11F.,2w2.3a3')); //11.2233
        console.log(changeInput('00A666F')); // 666
        console.log(changeInput('0.00')); // 0
        console.log(changeInput('.aa88cc')); // 0.88
        console.log(changeInput('99.')); // 99
    </script>
</body>

</html>

注释简洁说明版：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function changeInput(val = '') {
            let nums = val.replace(/[^\d.]/g, ""); // 一定是数字 或 空
            let arrs = nums.split(".") || []; // 用.号分成数组
            if (arrs.length > 2) { // 长度>1 有1个小数点， >2, 2个小数点
                nums = [arrs.splice(0, 1).join(''), '.', arrs.join('')].join('')
                // arrs.splice(0, 1).join('') 删除第0位,删除1个，得到被删除的1个元素   
                // arrs.join('') 除了第一个元素，拼接后面的元素
            };

            arrs = nums.split(".") || []; // 处理后的 内容再次变成数组 
            // 假如带有个小数点？假如第二个元素是0或者空就把第一项赋值给nums，假如nums是没有小数点继续使用nums
            arrs.length >= 2 ? Number(arrs[1]) == 0 || Number(arrs[1]) == "" && (nums = arrs[0]) : nums;
            return +nums || 0;
        }
        console.log(changeInput('A11F.,2w2.3a3')); //11.2233
        console.log(changeInput('A666F')); // 666
        console.log(changeInput('')); // 0
        console.log(changeInput('.aa88cc')); // 0.88
        console.log(changeInput('99.')); // 99
    </script>
</body>

</html>

前端酱紫

关注

1
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
只允许输入正常数字,过滤多个小数点和字符,去除第二个小数点

输入框输入数字过滤多个小数点,去除第二个小数点，获取正常数字使用场景：在input输入数字的时候，可以使用这个方法限制用户只能输入正常数字<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport"
复制链接

扫一扫