`
heavenslv
  • 浏览: 82584 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

Web前端银行卡号分段输入效果(如:6225 7687 0971 2222)

Web 
阅读更多

 

// 输入银行卡号时的分段处理效果(如:6225 7687 0971 2222)
function convertSpace(obj)
{
    var val = $.trim(obj.value).replace(/\s/g, '');

    var val2 = "";
    var len = 0;
    for (var i = 0; i < val.length; i++) {
        var ch = val.charAt(i);
        if(ch >= 0 && ch <= 9) {
            val2 += ch;
            ++len;
            if (len % 4 == 0) {
                val2 += ' ';
            }
        }
    }
    
    if(val2.substring(val2.length-1,val2.length)== ' ')
    {
        val2 = val2.substring(0,val2.length-1)
    }
    
    if(obj.value != val2) {
        var pos = getPositionForInput(obj);
        obj.value = val2;
        if(pos != val2.length) {
            if(val2.charAt(pos - 1) == ' ') {
                pos++;
            }
            setPositionForInput(obj, pos);
        }
    }
}
分享到:
评论

相关推荐

    Axure 8 Web前端+后台+移动前端 元件库

    Axure 8 Web前端+后台+移动前端 元件库是一个专门为产品经理和交互设计师准备的资源集合,旨在帮助他们在设计过程中快速构建清晰、高效的原型。这个元件库包含了各种Web前端、后台管理界面以及移动前端的组件,使得...

    阿里web前端开发手册.pdf

    "阿里web前端开发手册" 阿里web前端开发手册是一份详细的前端开发规范,涵盖了项目命名、目录命名、JS、CSS、SCSS、HTML、PNG 文件命名等多个方面的命名规范。下面是本手册中的一些重要知识点: 1. 命名规范: 在...

    7个异常精美的Web前端动画效果的实现(一)

    在本文中,我们将深入探讨七个精美的Web前端动画效果,这些效果可以显著提升用户体验和网站的视觉吸引力。作为Web开发的重要组成部分,前端动画不仅能够使用户界面更具动态性,还能帮助引导用户注意力,提高交互性。...

    大巧不工Web前端设计修炼之道.pdf

    《大巧不工:Web前端设计修炼之道》以Web前端设计的流程为主线,以前端设计的方法和原则为基础,围绕原型设计、模型设计、可用性设计、一致性设计和以用户为中心的设计等关键技术探讨了前端设计的规范、技巧与最佳...

    Delphi+Web前端开发教程基于TMS+WEB+Core框架.pdf

    **Delphi Web前端开发教程——基于TMS WEB Core框架** Delphi Web前端开发教程是针对想要使用TMS WEB Core框架创建Web应用程序的开发者,无论你是初学者还是高级开发者,本教程都提供了丰富的学习资源。TMS WEB ...

    web前端开发技术储久良第三版答案

    《Web前端开发技术储久良第三版答案》涵盖了前端开发领域的关键知识点,主要针对储久良教授编著的教材第三版中的习题和实验提供了详尽的解答。这本书旨在帮助学习者深入理解Web前端开发的核心概念和技术,通过解决...

    web前端开发综合实例

    在IT行业中,Web前端开发是构建互联网应用的重要组成部分,它主要负责用户与应用程序之间的交互界面。本综合实例将深入探讨“响应式页面”这一关键概念,这是现代网页设计的基石,确保网页能在不同设备和屏幕尺寸上...

    基于html5的web前端设计(旅游景点介绍)

    【压缩包子文件的文件名称列表】:"web前端设计"可能包含了以下文件: 1. index.html:主页面文件,包含HTML5结构和链接到CSS及JavaScript文件的引用。 2. style.css:用于定义网页样式的CSS文件,包括字体、颜色、...

    6个顶级时尚的Web前端3D效果源码(六)

    标题 "6个顶级时尚的Web前端3D效果源码(六)" 提示我们这是一个关于Web前端开发的资源,特别是涉及到3D效果的实现。3D效果在现代网页设计中非常流行,它们能够为用户提供更加生动、立体的交互体验。在这一系列的...

    web前端旅游页面div+css实现

    【标题】:“web前端旅游页面div+css实现” 在网页设计中,前端开发扮演着至关重要的角色,它决定了用户与网站交互的直观性和美观性。本项目“web前端旅游页面div+css实现”是一个专注于旅游主题的前端页面设计实例...

    6个顶级时尚的Web前端3D效果源码(三)

    在本资源中,我们聚焦的是"6个顶级时尚的Web前端3D效果源码"的第三个部分。Web前端开发在近年来发展迅速,尤其是在视觉呈现上,3D效果的应用为网页增添了丰富的动态性和交互性,极大地提升了用户体验。这些源码是...

    web前端网页设计作品web期末大作业web前端作业网页制作代码web大作业制作网页代码

    本资源就可以为你解决你所面临的这些问题,原始HTML+CSS+JS页面设计, web大学生网页设计作业源码,这是一个不错的网页制作资源合集,画面精美,非常适合初学者学习使用。 多套(HTML+CSS+JS)网页设计的学生期末大...

    web前端开发html+css+js免费下载(设计作品成品)

    综合以上,这个设计作品不仅展示了基础的前端开发技术,还融入了现代Web开发的高级特性,对于学习和实践Web前端开发有着很高的参考价值。无论是初学者还是有一定经验的开发者,都可以从中学习到实际的开发技巧和实践...

    web前端做的一个购物商城

    在本项目中,“web前端做的一个购物商城”是一个基于Web技术构建的在线购物平台,它包含了一系列关键功能,如用户登录注册、个人中心管理、购物车操作以及搜索功能。这个项目利用了JavaSC(可能是JavaScript的误写)...

    Web前端开发实训项目源代码

    【Web前端开发实训项目源代码】是一个以Bootstrap框架为基础的实训项目,主要目的是为了帮助学习者掌握Web前端开发的关键技术和实践经验。在这个项目中,开发者利用Bootstrap的灵活性和响应式设计特性,构建了一个...

    web前端仿手机左右滑动

    标题中的“web前端仿手机左右滑动”是指在网页开发中实现类似移动设备上常见的左右滑动页面的效果。这种效果通常用于创建全屏滚动、轮播图或者展示多个项目的流式布局。在移动互联网时代,为了让用户体验更加贴近...

    web前端设计与开发期末作品/期末大作业

    虽然这是一个静态项目,但开发者可能利用JavaScript或者jQuery等库,为网站添加了一些基本的交互效果,如图片滑动展示、鼠标悬停效果或点击触发的动画。这不仅可以提升用户体验,也能让静态页面显得更为生动有趣。 ...

    【千锋】Web前端项目精讲视频(29集)

    千锋Web前端教程:28-29.mui地理定位实战(2集) 千锋Web前端教程:26-27.iscroll实战(2集) 千锋Web前端教程:23-25.ionic-spa应用实战(3集) 千锋Web前端教程:19-22.微信开发扫一扫(4集) 千锋Web前端教程:16...

Global site tag (gtag.js) - Google Analytics