在前端页面开发过程中,总会碰到不允许输入框输入emoji表情的需求,我的思路是通过编码用正则匹配表情,然后将其替换为空字符创。但是问题也是显而易见的,完整的编码集是什么呢?查阅了官方文档,发现上面并没有给出想要的答案。并且很多emoji表情除了主编码还有副编码(这是我给取的名字),举个例子:

  \uD83C\uDC00是一个表情,\uD83C\uDC00\u200D又是一个表情,我把\uD83C\uDC00称为主编码,\u200D称为副编码(或者衍生编码,反正意思理解了就行)。

最终解决方案如下:

 var regStr = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/ig;
2 var org_val = $("input").val();
3
4 if(regStr.test(org_val)){
5   $("#input").val(org_val.replace(regStr,""));
6 }
上面的正则可以匹配iOS10.2.1及之前的全部emoji表情,Android的表情因为比较多,如上面的正则有遗漏,可自行补充。测试一个表情的编码方法如下:
<input type="text" />
2
3
4 var org_val = $("input").val();
5 console.log(escape(org_val));
6 //escape得到%uD83C%u.........格式的编码,可对应成\u...格式

最全最详细的用JS过滤Emoji表情的输入的更多相关文章

  1. 用JS过滤Emoji表情的输入

    本文为原创,转载请注明出处: cnzt       文章:cnzt-p http://www.cnblogs.com/zt-blog/p/6773854.html 在前端页面开发过程中,总会碰到不允许 ...

  2. Js 过滤emoji表情...持续补充中..

    原文来自: https://www.cnblogs.com/tsjTSJ/p/7065544.html 最全最详细的用JS过滤Emoji表情的输入   在前端页面开发过程中,总会碰到不允许输入框输入e ...

  3. js过滤emoji表情符号

    手机端常常会遇到用户输入框,输入emoji,如果是数据库是UTF8,会遇到报错:SQLException: Incorrect string value: '\xF0\x9F\x98\x84' for ...

  4. java过滤emoji表情(成功率高)

    转载自:http://blog.csdn.net/huangchao064/article/details/53283738 基本能过滤大部分的ios,安卓,微信emoji表情 有很多别的帖子搜出来很 ...

  5. java代码过滤emoji表情

    可以新建一个过滤器的类,在类中书写如下代码: public static String filterEmoji(String source) {           if(source != null ...

  6. 过滤特殊字符(包括过滤emoji表情)

    /** * 过滤特殊字符 * @param $text * @return mixed */ public static function filterSpecialChars($text) { // ...

  7. python3 清除过滤emoji表情

    python3 清除过滤emoji表情 方法一: emoji处理库,emoji官网:https://pypi.org/project/emoji/ #安装 pip install emoji 官方例子 ...

  8. JS过滤emoji

    function filterEmoji(text){ var ranges = [ '\ud83c[\udf00-\udfff]', '\ud83d[\udc00-\ude4f]', '\ud83d ...

  9. java过滤emoji表情

    import java.util.regex.Matcher; import java.util.regex.Pattern; public class test { /** * 表情过滤 * */ ...

随机推荐

  1. iOS笔记之文件读写

    最近做的项目中要存储一组图片数据,图片带有name,date等属性,处理办法是讲image图片直接存在沙盒documents文件中,再使用plist文件存储图片属性和image路径. 存入图片: - ...

  2. 三十分钟理解:双调排序Bitonic Sort,适合并行计算的排序算法

    欢迎转载,转载请注明:本文出自Bin的专栏blog.csdn.net/xbinworld 技术交流QQ群:433250724,欢迎对算法.技术.应用感兴趣的同学加入 双调排序是data-indepen ...

  3. 词云:解决pip install wordcloud安装过程中报错“error: command 'x86_64-linux-gnu-gcc' failed with exit status 1”问题

    外部环境:ubuntu16.04, 64bits, 全局环境python2.7 在虚拟环境(python3.5)中执行 pip install wordcloud 时安装失败,报错: error: c ...

  4. 第十课 C++异常简介

    异常不是错误,异常是程序中可预料到的另一条执行分支,是可预见的.错误是不可预料的. C++内置了异常处理的语法元素try...catch...,如下: C++通过throw语句抛出异常信息: 上图中t ...

  5. springboot整合mybatis增删改查(三):mybatis逆向工程

    上一篇已经把项目基本框架完善,接下来就是利用Mybatis Generator逆向工程进行mybatis的整合. 我们在创建项目开始的时候已经勾选web,mybatis,sql等,但是这些依赖还是不够 ...

  6. Caused by: java.lang.NoClassDefFoundError: Could not initialize class org.elasticsearch.threadpool.ThreadPool

    springboot中遇到的, 将guava添加到项目中即可.(当时添加的是guava 18)

  7. Linux 脚本编写

    第一个shell脚本编写 #!/bin/bash # 上面中的 #! 是一种约定标记, 它可以告诉系统这个脚本需要什么样的解释器来执行; #定义变量: APP_BASE_PATH="/opt ...

  8. graphql-yoga interface && union 使用

      接口就是一个约定,方便数据的约定,union 可以实现数据类型的共享,减少代码量 基本项目 参考 https://github.com/rongfengliang/graphql-yoga-doc ...

  9. 【Xamarin】Visual Studio 2013 Xamarin for Android开发环境搭建与配置&Genymotion

    Xamarin Xamarin是基于Mono的平台. Xamarin旨在让开发者可以用C#编写iOS, Android, Mac应用程序,也就是跨平台移动开发. 下载资源 1,进入Xamarin官方网 ...

  10. centeros php 实战

    apache 默认安装路径 Fedora Core, CentOS, RHEL:ServerRoot              ::      /etc/httpdPrimary Config Fle ...