uniapp 输入框如何禁止输入表情

于 2024-01-30 10:36:46 发布
阅读量556 收藏 10
点赞数 4
分类专栏： uniapp 文章标签： uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45561965/article/details/135927499
版权

在做项目中遇到一个问题
输入框要禁止输入手机输入法自带的表情符号
在网上找了相关的解决方案
顺便记录一下
话不多说，直接上代码
在这里插入图片描述

在这里插入图片描述
希望可以帮到你
看到这个点个关注呗
点个关注，不迷路~~~

烂笔头儿@
关注
  • 4
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
uniapp 禁止textarea/input输入表情
weixin_46319117的博客
07-04 1752
uniapp 禁止textarea/input输入表情
uniapp 小程序input框过滤表情等特殊字符
weixin_58421147的博客
03-02 1325
首先通过正则验证，验证不通过时，通过字符串.replace方法，替换掉表情。最后需要return，替换掉输入框中的内容。代码段为input框通过@input绑定的方法内容。
在input或者textarea输入框中禁止输入表情
qq_47163013的博客
10-18 848
2、表情和特殊字符都不能输入。
工作常见问题
快乐学代码
12-09 805
C端 1.关于底部遮挡问题 底部按钮遮挡内容（苹果X） 在上边的区域加上 padding-bottom: calc(110rpx + env(safe-area-inset-bottom)); 2.下拉刷新 参考页面 pages/coupon/center/index pages/setGame/gameList onPullDownRefresh:function(){ ​ this.couponActivityList = [];//下拉列表为空 ​ this.pageIndex =
在iOS中emoji表情的判断、过滤和禁用
hsf_study的博客
02-13 4852
emoji就是表情符号，来自日语词汇“絵文字”（假名为“えもじ”，读音即emoji）     emoji的创造者是栗田穣崇（Shigetaka Kurita），他将目光投向儿时的各种元素以获取灵感，如日本漫画和日本汉字等。“日本漫画中有许多不同的符号。漫画家会画出一些表情，表现一个人满头大汗或是迸发出一个想法时头上出现一个灯泡。在很多情况下，我借用了这种表达方式，然后进行了重新安排。”同时，
前端禁止输入emoji表情的方法
最新发布
BHSZZY的博客
01-24 892
【代码】前端禁止输入emoji表情的方法。
前端uniapp表情插件
05-09
前端uniapp表情插件
使用正则限制input框只能输入数字/英文/中文等等
10-26
限制input框只能输入数字或英文的方法有很多，下面为大介绍下使用正则是如何实现的，感兴趣的朋友不要错过
android 输入框EditText禁止输入Emoji表情符
04-30
android 输入框EditText禁止输入Emoji表情符，博客地址：http://blog.csdn.net/elsdnwn/article/details/45390771
input 禁止输入特殊字符的四种实现方式
09-01
某些特殊字符传入后台会产生错误，可能导致sql注入，所以要想法从根本上拦截，接下来通过本文给大家介绍input 禁止输入特殊字符的方式，对input 禁止特殊字符知识感兴趣的朋友一起看下吧
Vue ElementUI实现:限制输入框只能输入正整数的问题
11-19
input输入框中禁止输入小数和负数（*只允许输入正整数 *） 最近在做项目中碰见了这么个问题，需要输入数字，但是只能输入正整数，在网上找的没找到自己想要的，所以就自己想了两个办法，在这里跟大家分享一下。...
uniapp中输入框禁用表情与特殊符号
fairyfree的博客
09-19 1838
输入框 检验特殊字符和表情
正则验证 input 输入框，禁止输入表情包
qq_36437172的博客
10-03 3440
禁止输入表情包方法如下： includeSpecial (value) { if (!value) { return } //eslint-disable-next-line const regStr = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u.
移动端之禁止输入框输入表情
rgpbrave的博客
06-08 2032
思路是给输入框绑定 change事件,用正则匹配输入框的内容，发现有表情就替换为空 只能输入数字英文啊等等都是这个思路 我这里是用的 vue 框架（别的方法都一样），例如 <input type="text" v-model="inputMessage" :change="check_num()"> inputMessage ：输入框输入的值 check_num(){ var regStr = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\
uni-app聊天功能输入框删除emoji表情
mbf_running的博客
11-04 1206
最近项目中碰到一个问题，就是聊天功能中，文字和emoji表情删除的时候emoji表情需要点击两次删除，如果只点击一次的话并不能删除掉，会显示乱码
微信小程序禁止input框输入emoji表情
weixin_45729307的博客
06-05 3525
wxml <input class="weui-input" name="receiptMan" maxlength="10" bindinput="inputVal" data-name="receiptMan" value="{{form.receiptMan}}" placeholder="请输入姓名" /> wxjs // 禁止input框输入表情 regStrFn: function (str) { // 转换一下编码 　　let reg = /([^\u00
【uni-app一个很大的坑】监听input标签的输入事件获取输入的值uni-app和Vue有很大的区别【uni-app的input接收值延迟的解决办法】
热门推荐
weixin_43343144的博客
09-21 3万+
官方推荐input事件获取内容方式： <template> <view> <input type="number" placeholder="请输入" @input="onInput" /> </view> </template> <script> export default...
微信小程序开发：禁止输入表情的控制，验证方法，光标控制
weixin_33701564的博客
07-09 2530
<input class="weui-input" name="receiptMan" maxlength="10" bindinput="inputVal" data-name="receiptMan" value="{{form.receiptMan}}" placeholder="请输入姓名" /> regStrFn: function(str){ 　　let reg ...
uniapp输入框添加表情
09-07
要在uniapp的输入框中添加表情，可以通过引入第三方的表情包库来实现。 首先，要确保项目中安装了uniapp相关的开发工具和插件。接下来，可以选择一个适用于uniapp的表情包库，比如"taro-emoji"或者"uni-emoji-picker"等。 1. 引入表情包库：在项目的根目录中的package.json文件中的dependencies中添加表情包库的名称和版本号，并执行npm install或cnpm install安装相应的依赖。 2. 在需要使用表情的页面中引入表情包库的组件或者工具方法。可以是一个表情选择器组件，也可以是一个转换表情文本为表情图片的工具方法。 3. 在对应的输入框中编写代码，通过调用表情包库的组件或者工具方法来实现添加表情的功能。可以根据具体的需求来响应用户的输入，比如监听输入框的输入事件，当用户输入表情代码时，调用表情包库的组件或者工具方法来转换为对应的表情图片显示在输入框中。 4. 可以考虑对表情的代码和图片进行封装，使其易于扩展和维护。比如可以将表情的代码和图片存储在一个映射表中，通过传入表情代码来获取对应的表情图片。 需要注意的是，在添加表情功能的过程中，要考虑用户输入的合法性、界面展示的美观性以及性能的优化等方面的问题。可以结合具体的业务需求和项目特点进行调整和优化。 总之，通过引入第三方的表情包库，并结合uniapp的开发特点和技术，可以实现在输入框中添加表情的功能。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值