表情输入框的插件使用

1.

插件基于jquery1.8+,所以要先引入jquery.js

在页面引入

https://github.com/JFrameSea/emojione/blob/master/lib/js/emojione.min.js

然后引入

https://github.com/JFrameSea/emojionearea/blob/master/dist/emojionearea.min.js

以及相应的css

https://github.com/JFrameSea/emojionearea/blob/master/dist/emojionearea.min.css


2.

在自定义的js中使用

var emojioneareaEditor = $('#emojionearea-editor');


// init emotion area

    var gEmojioneArea = emojioneareaEditor.emojioneArea({

        autocomplete: false,

        hidePickerOnBlur: false,

        autoHideFilters: true,

        filters: {

    // 这里是自定义显示的表情数组

            smileys_people: UFSCH.emojiNames

        },

        events: {

            picker_hide: function() {

                isShowEmotion = true;

            },

            picker_show: function() {

                isShowEmotion = false;

            },

            keydown: function(editor, event) {

                if

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在uniapp的输入框中添加表情,可以通过引入第三方的表情包库来实现。 首先,要确保项目中安装了uniapp相关的开发工具和件。接下来,可以选择一个适用于uniapp的表情包库,比如"taro-emoji"或者"uni-emoji-picker"等。 1. 引入表情包库:在项目的根目录中的package.json文件中的dependencies中添加表情包库的名称和版本号,并执行npm install或cnpm install安装相应的依赖。 2. 在需要使用表情的页面中引入表情包库的组件或者工具方法。可以是一个表情选择器组件,也可以是一个转换表情文本为表情图片的工具方法。 3. 在对应的输入框中编写代码,通过调用表情包库的组件或者工具方法来实现添加表情的功能。可以根据具体的需求来响应用户的输入,比如监听输入框的输入事件,当用户输入表情代码时,调用表情包库的组件或者工具方法来转换为对应的表情图片显示在输入框中。 4. 可以考虑对表情的代码和图片进行封装,使其易于扩展和维护。比如可以将表情的代码和图片存储在一个映射表中,通过传入表情代码来获取对应的表情图片。 需要注意的是,在添加表情功能的过程中,要考虑用户输入的合法性、界面展示的美观性以及性能的优化等方面的问题。可以结合具体的业务需求和项目特点进行调整和优化。 总之,通过引入第三方的表情包库,并结合uniapp的开发特点和技术,可以实现在输入框中添加表情的功能。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值