一、问题描述：

我们在输入银行账号会设置每四位添加一个空格，输入金额，每三位添加一个空格。那么，在元素用户界面组件中，如何实现呢？

二、效果图：

三、实现代码：

El-table-column prop=' account '标签='银行账号模板槽-作用域='范围' El-输入类型=' text ' max length=' 23 ' v-model=' scope。划船。帐户“占位符=”请输入银行账号@change='validateNum(作用域$ index)'/El-输入/模板/El-表-列//输入银行卡号validateNum(索引){ this。setnum(这个。供应商objs。供应商银行账户，索引)}，//设置银行卡号，每四位添加一个空格setNum(数据，索引){ data.forEach((元素，I)={元素。帐户=元素。账户。替换(/ s/g ' ').replace(/[^d]/g,"。替换(/(d{4})(？=d)/g，' $1 ')这个$set(元素、“account”、element.account) }) }，四、思路：

1、在组件的变化事件中添加实现方法（因为我们的业务需求是可以添加多个银行卡号，所以用指数做了区分),取出每行的值；

2、用元素。帐户=元素。账户。替换(/ s/g ' ').replace(/[^d]/g,"。替换(/(d{4})(？=d)/g，' $1 ')，类似正则表达式的方法对数据进行处理；

这个$set(元素、“账号”，元素。账户)，设置方法，将处理后的值设置到模型中，处理后的数据就保存到模型中了。

实现起来也非常简单，但是因为元素-用户界面没有提供输入设置的方法，所以需要自己根据需求完善一下。

补充：下面看下射流研究…填写银行卡号时，每四个数字用空格隔开

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' XML : lang=' EN ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8 ' title document/title script src=' http : js/jquery。js '/脚本/头体脚本var num=0；函数InputAccount(){ var str=$(' #银行卡').val()；var elem=文档。getelementbyid('银行卡');控制台。日志(elem)；if(str。长度数字){ var c=str。替换(/ s/g ' ')；if(str！=' c . length 4c . length % 4==1){ $(' # BankCard ').val(str.substring(0，str。长度-1))" "字符串。子串。长度-1，字符串。长度))；} } if(elem。setselectionrange){//W3C setTimeout(function(){ elem。setselectionrange(elem。价值。长度，elem。价值。长度)；艾伦。焦点()；},0);} else if(elem。createtextrange){//IE var textRange=elem。createtextrange()；textRange.moveStart('字符'，elem。价值。长度)；textRange.moveEnd('字符',0);文本范围。select()；} num=str.length}/脚本输入类型=' text ' name=' on input=' inputAccount()' id=' bank card '/body

/html！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。L1-过渡时期。DTD ' html xmlns=' http://www .w3。org/1999/XHTML ' XML : lang=' EN ' head meta http-equiv=' Content-Type ' Content=' text/html；charset=UTF-8 ' title document/title script src=' http : js/jquery。js '/脚本/头体输入类型=' text ' name=' id=' box '/script $(function(){ $(' # box ').key up(function(){ var value=$(this)).val().替换(/s/g ' ').替换(/(d{4})(？=d)/g，' $ 1 ')；$(这个)。val(value)})})/script/body/html总结

以上所述是小编给大家介绍的某视频剪辑软件中元素用户界面输入银行账号每四位加一个空格的实现代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！