微信小程序-input等输入框禁止输入空格

小鱼儿 2023-07-24 03:07 19阅读 0赞

> 发现表单提交，都是默认允许空格输入，但实际情况下，一般是不能有的，比如修改昵称、name等，有空格的输入，就显得不是那么的友好，比如吃鸡，王者等，昵称都是不允许带有空格符，所以，今个儿就来说说，微信小程序中，如何禁止空格符的输入？
> 
> 其实思路很明确， 就是监控输入框，在每一次输入，替换掉输入的空格符；

inputRemark: function (e) {
        var nickNameOld = e.detail.value;
        this.setData({
          nickName: nickNameOld.replace(/\s+/g, '')
        })
      },

解析：

1、利用正则表达式：“ /\\s+/g ”去匹配空格，然后使用replace将匹配到的空格符替换成 ‘’（空）

2、replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

用法：stringObject.replace(*regexp/substr*,*replacement*)

详用请参考：[https://www.w3school.com.cn/jsref/jsref\_replace.asp][https_www.w3school.com.cn_jsref_jsref_replace.asp]

3、同下篇类似，原理就是利用数据双向绑定的特性同步当前input的value值；

[如何实时统计输入框用户输入字数？][Link 1]

--------------------

### 往期回顾： ###

【1】[如何实时统计输入框用户输入字数？][Link 1]

【2】[怎么防止用户表单二次提交，你知道吗？][Link 2]

【3】[页面如何调用组件内置方法？][Link 3]

--------------------

> ❤如果文章对您有所帮助，就在文章的右上角或者文章的末尾点个赞吧！(づ￣ 3￣)づ
> 
> ❤如果喜欢大白兔分享的文章，就给大白兔点个关注吧！(๑′ᴗ‵๑)づ╭❤～
> 
> ❤对文章有任何问题欢迎小伙伴们下方留言或者入群探讨【群号：708072830】
> 
> ❤鉴于个人经验有限，所有观点及技术研点，如有异议，请直接回复讨论（请勿发表攻击言论）。

[https_www.w3school.com.cn_jsref_jsref_replace.asp]: https://www.w3school.com.cn/jsref/jsref_replace.asp
[Link 1]: https://blog.csdn.net/weixin_43970743/article/details/105287674
[Link 2]: https://blog.csdn.net/weixin_43970743/article/details/105366271
[Link 3]: https://blog.csdn.net/weixin_43970743/article/details/105382576