Skip to content

qq表情组件,无需手动加载css,支持插入前和插入后JS回调。

Notifications You must be signed in to change notification settings

bin20060407/jquery.qqface-old

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

25 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

jquery.qqface

Packagist

jQuery QQ 表情插件。
点击一个按钮,弹出一个选择QQ表情的组件,点击即可选择表情,插入到textara里面。

查看:示例:http://kyo4311.github.io/jquery.qqface/

开始使用

  1. 引入jQuery
  2. 引入jquery.qqface.js

html

<div>
    <textarea id="liveChatContent" spellcheck="false"></textarea>
</div>
<a href="javascript:;" id="face">表情</a>

js

//看起来很简单!
$.qqface({
    imgPath : 'gif/',
    textarea : $('#liveChatContent'),
    handle : $('#face')
});

进阶使用

页面有多个需要输入表情的文本框,对应触发输入也有多个,输入框可能是动态生成

html

<div>
    <textarea id="chat-1" spellcheck="false"></textarea>
</div>
<a href="javascript:;" class="face" data-id="1">表情</a>
<div>
    <textarea id="chat-2" spellcheck="false"></textarea>
</div>
<a href="javascript:;" class="face" data-id="2">表情</a>

js

$.qqface({
    imgPath : 'gif/',
    handle : 'a.face',
    // 动态设置表情插入的文本框
    setTextArea : function(current) {
        return $('#chat-' + current.data('id'));
    }
});

开发

# clone
git clone ...
# 进入目录
npm install
# 打包发布
gulp js

代码列表

序号 符号 中文释义 图片
0 /::) 微笑 微笑
1 /::~ 撇嘴 撇嘴
2 /::B 色
3 /::| 发呆 发呆
4 /:8-) 得意 得意
5 /::< 流泪 流泪
6 /::$ 害羞 害羞
7 /::X 闭嘴 闭嘴
8 /::Z 睡
9 /::'( 大哭 大哭
10 /::-| 尴尬 尴尬
11 /::@ 发怒 发怒
12 /::P 调皮 调皮
13 /::D 呲牙 呲牙
14 /::O 惊讶 惊讶
15 /::( 难过 难过
16 /::+ 酷
17 /:--b 冷汗 冷汗
18 /::Q 抓狂 抓狂
19 /::T 吐
20 /:,@P 偷笑 偷笑
21 /:,@-D 可爱 可爱
22 /::d 白眼 白眼
23 /:,@o -傲慢 -傲慢
24 /::g 饥饿 饥饿
25 /:|-) 困
26 /::! 惊恐 惊恐
27 /::L 流汗 流汗
28 /::> 憨笑 憨笑
29 /::,@ 大兵 大兵
30 /:,@f 奋斗 奋斗
31 /::-S 咒骂 咒骂
32 /:? 疑问 疑问
33 /:,@x 嘘
34 /:,@@ 晕
35 /::8 折磨 折磨
36 /:,@! 衰
37 /:!!! 骷髅 骷髅
38 /:xx 敲打 敲打
39 /:bye 再见 再见
40 /:wipe 擦汗 擦汗
41 /:dig 抠鼻 抠鼻
42 /:handclap 鼓掌 鼓掌
43 /:&-( 糗大了 糗大了
44 /:B-) 坏笑 坏笑
45 /:<@ 左哼哼 左哼哼
46 /:@> 右哼哼 右哼哼
47 /::-O 哈欠 哈欠
48 /:>-| 鄙视 鄙视
49 /:P-( 委屈 委屈
50 /::'| 快哭了 快哭了
51 /:X-) 阴险 阴险
52 /::* 亲亲 亲亲
53 /:@x 吓
54 /:8* 可怜 可怜
55 /:pd 菜刀 菜刀
56 /: 西瓜 西瓜
57 /:beer 啤酒 啤酒
58 /:basketb 篮球 篮球
59 /:oo 乒乓 乒乓
60 /:coffee 咖啡 咖啡
61 /:eat 饭
62 /:pig 猪头 猪头
63 /:rose 玫瑰 玫瑰
64 /:fade 凋谢 凋谢
65 /:showlove 示爱 示爱
66 /:heart 爱心 爱心
67 /:break 心碎 心碎
68 /:cake 蛋糕 蛋糕
69 /:li 闪电 闪电
70 /:bome 炸弹 炸弹
71 /:kn 刀
72 /:footb 足球 足球
73 /:ladybug 瓢虫 瓢虫
74 /:shit 便便 便便
75 /:moon 月亮 月亮
76 /:sun 太阳 太阳
77 /:gift 礼物 礼物
78 /:hug 拥抱 拥抱
79 /:strong 强
80 /:weak 弱
81 /:share 握手 握手
82 /:v 胜利 胜利
83 /:@) 抱拳 抱拳
84 /:jj 勾引 勾引
85 /:@@ 拳头 拳头
86 /:bad 差劲 差劲
87 /:lvu 爱你 爱你
88 /:no NO NO
89 /:ok OK OK
90 /:love 爱情 爱情
91 /: 飞吻 飞吻
92 /:jump 跳跳 跳跳
93 /:shake 发抖 发抖
94 /: 怄火 怄火
95 /:circle 转圈 转圈
96 /:kotow 磕头 磕头
97 /:turn 回头 回头
98 /:skip 跳绳 跳绳
99 /:oY 投降 投降
100 /:#-0 激动 激动
101 /:hiphot 乱舞 乱舞
102 /:kiss 献吻 献吻
103 /:<& 左太极 左太极
104 /:&> 右太极 右太极

注: 符号对应微信公众号表情符号

todo

  • [] 新增js、PHP最终显示表情说明

License

Copyright (c) 2016 guosheng Licensed under the MIT License.

About

qq表情组件,无需手动加载css,支持插入前和插入后JS回调。

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 66.9%
  • HTML 29.6%
  • CSS 3.5%