|
@ -1,12 +1,11 @@ |
|
|
(function (factory) { |
|
|
|
|
|
|
|
|
;(function (factory) { |
|
|
try { |
|
|
try { |
|
|
const jQuery = require('jquery'); |
|
|
|
|
|
factory(jQuery); |
|
|
|
|
|
|
|
|
const jQuery = require('jquery') |
|
|
|
|
|
factory(jQuery) |
|
|
} catch (e) { |
|
|
} catch (e) { |
|
|
factory(jQuery); |
|
|
|
|
|
|
|
|
factory(jQuery) |
|
|
} |
|
|
} |
|
|
})(function ($) { |
|
|
})(function ($) { |
|
|
|
|
|
|
|
|
const dictionary = { |
|
|
const dictionary = { |
|
|
a: '阿啊吖嗄锕安爱暗案按', |
|
|
a: '阿啊吖嗄锕安爱暗案按', |
|
|
ai: '爱呆挨哀埃碍艾唉矮哎癌嗌嗳嗳嫒捱暧瑷皑砹硙蔼诶锿隘霭', |
|
|
ai: '爱呆挨哀埃碍艾唉矮哎癌嗌嗳嗳嫒捱暧瑷皑砹硙蔼诶锿隘霭', |
|
@ -49,7 +48,8 @@ |
|
|
chao: '朝超潮吵抄炒嘲绰剿巢怊晁焯耖钞', |
|
|
chao: '朝超潮吵抄炒嘲绰剿巢怊晁焯耖钞', |
|
|
che: '车彻尺撤扯坼屮掣澈砗辙', |
|
|
che: '车彻尺撤扯坼屮掣澈砗辙', |
|
|
chen: '称陈沉晨尘沈臣辰趁衬琛嗔宸忱抻榇橙湛疹眈碜秤肜胂谌谶郴龀', |
|
|
chen: '称陈沉晨尘沈臣辰趁衬琛嗔宸忱抻榇橙湛疹眈碜秤肜胂谌谶郴龀', |
|
|
cheng: '成城程称承枪乘盛诚撑呈惩澄丞伧噌埕塍晟枨柽樘橙浈瞠秤蛏裎赪逞郢酲铖铛骋', |
|
|
|
|
|
|
|
|
cheng: |
|
|
|
|
|
'成城程称承枪乘盛诚撑呈惩澄丞伧噌埕塍晟枨柽樘橙浈瞠秤蛏裎赪逞郢酲铖铛骋', |
|
|
chi: '吃持迟赤尺池驰耻痴齿斥嗤匙侈傺叱哆哧啻坻墀媸弛彳搋敕沱炽瘛眙眵笞篪翅胝芪茌茬蚩螭褫豉踅踟郗饬魑䗖', |
|
|
chi: '吃持迟赤尺池驰耻痴齿斥嗤匙侈傺叱哆哧啻坻墀媸弛彳搋敕沱炽瘛眙眵笞篪翅胝芪茌茬蚩螭褫豉踅踟郗饬魑䗖', |
|
|
cho: '重冲充抽仇崇愁丑臭筹', |
|
|
cho: '重冲充抽仇崇愁丑臭筹', |
|
|
chon: '重冲充崇虫宠忡憧潼盅', |
|
|
chon: '重冲充崇虫宠忡憧潼盅', |
|
@ -92,7 +92,7 @@ |
|
|
din: '定顶订丁钉盯鼎叮仃啶', |
|
|
din: '定顶订丁钉盯鼎叮仃啶', |
|
|
ding: '定顶订丁钉盯鼎叮仃啶汀玎町疔碇耵腚葶酊锭饤', |
|
|
ding: '定顶订丁钉盯鼎叮仃啶汀玎町疔碇耵腚葶酊锭饤', |
|
|
diu: '丢铥', |
|
|
diu: '丢铥', |
|
|
'do': '都动东读斗洞懂冬豆抖', |
|
|
|
|
|
|
|
|
do: '都动东读斗洞懂冬豆抖', |
|
|
don: '动东洞懂冬董冻栋侗咚', |
|
|
don: '动东洞懂冬董冻栋侗咚', |
|
|
dong: '动东洞懂冬董冻栋侗咚垌岽峒恫氡甬硐胨胴酮鸫', |
|
|
dong: '动东洞懂冬董冻栋侗咚垌岽峒恫氡甬硐胨胴酮鸫', |
|
|
dou: '都读斗豆抖兜逗陡渎痘窦窬篼蔸蚪逾饾', |
|
|
dou: '都读斗豆抖兜逗陡渎痘窦窬篼蔸蚪逾饾', |
|
@ -222,7 +222,7 @@ |
|
|
liu: '六流留陆刘柳溜碌旒榴泖泵浏熘琉瘤硫绺蒌蓼遛鎏铆锍镏镠飗馏骝鹠', |
|
|
liu: '六流留陆刘柳溜碌旒榴泖泵浏熘琉瘤硫绺蒌蓼遛鎏铆锍镏镠飗馏骝鹠', |
|
|
lo: '咯龙楼露弄隆笼漏搂陋', |
|
|
lo: '咯龙楼露弄隆笼漏搂陋', |
|
|
lon: '龙弄隆笼拢胧聋垄咙垅', |
|
|
lon: '龙弄隆笼拢胧聋垄咙垅', |
|
|
'long': '龙弄隆笼拢胧聋垄咙垅昽栊泷珑癃眬砻窿茏陇', |
|
|
|
|
|
|
|
|
long: '龙弄隆笼拢胧聋垄咙垅昽栊泷珑癃眬砻窿茏陇', |
|
|
lou: '楼露漏搂陋偻喽娄嵝瘘窭篓耧蒌蝼镂髅䁖', |
|
|
lou: '楼露漏搂陋偻喽娄嵝瘘窭篓耧蒌蝼镂髅䁖', |
|
|
lu: '路陆露录绿鲁卢炉鹿碌芦庐卤噜垆戮掳撸栌橹泸渌漉潞璐瘳禄箓簏胪舻蓼虏赂轳辂辘逯酪镥颅鲈鸬鹭麓', |
|
|
lu: '路陆露录绿鲁卢炉鹿碌芦庐卤噜垆戮掳撸栌橹泸渌漉潞璐瘳禄箓簏胪舻蓼虏赂轳辂辘逯酪镥颅鲈鸬鹭麓', |
|
|
lua: '乱卵娈孪峦挛栾滦脔銮', |
|
|
lua: '乱卵娈孪峦挛栾滦脔銮', |
|
@ -500,10 +500,10 @@ |
|
|
zuan: '钻赚攥纂缵躜', |
|
|
zuan: '钻赚攥纂缵躜', |
|
|
zui: '最罪嘴堆醉羧蕞觜', |
|
|
zui: '最罪嘴堆醉羧蕞觜', |
|
|
zun: '尊遵撙樽鳟', |
|
|
zun: '尊遵撙樽鳟', |
|
|
zuo: '作做坐左座昨佐琢乍凿唑嘬怍撮柞砟祚笮胙迮酢阼' |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
zuo: '作做坐左座昨佐琢乍凿唑嘬怍撮柞砟祚笮胙迮酢阼', |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
const zhKeys = Object.keys(dictionary); |
|
|
|
|
|
|
|
|
const zhKeys = Object.keys(dictionary) |
|
|
|
|
|
|
|
|
//默认参数
|
|
|
//默认参数
|
|
|
const defaults = { |
|
|
const defaults = { |
|
@ -513,189 +513,196 @@ |
|
|
ZH: false, |
|
|
ZH: false, |
|
|
upperCase: false, |
|
|
upperCase: false, |
|
|
offsetX: 0, |
|
|
offsetX: 0, |
|
|
offsetY: 0 |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
offsetY: 0, |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
$.fn.extend({ |
|
|
$.fn.extend({ |
|
|
'virtualkeyboard': function (options) { |
|
|
|
|
|
|
|
|
virtualkeyboard: function (options) { |
|
|
//var opts = $.extend({}; defaults, options); //使用jQuery.extend 覆盖插件默认参数
|
|
|
//var opts = $.extend({}; defaults, options); //使用jQuery.extend 覆盖插件默认参数
|
|
|
let keyboardHTML = ''; |
|
|
|
|
|
keyboardHTML += '<div class="virtualkeyboard">'; |
|
|
|
|
|
keyboardHTML += '<div class="outputZone">'; |
|
|
|
|
|
keyboardHTML += '<span class="zh-pinyin-letter"></span>'; |
|
|
|
|
|
keyboardHTML += '<div class="outputZoneOp">'; |
|
|
|
|
|
keyboardHTML += '<span class="outputZoneUp unclick">◀</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="outputZoneDown">▶</span><span class="page">1/1</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div class="keyboardOp">'; |
|
|
|
|
|
keyboardHTML += '<ul class="output-ZH"></ul>'; |
|
|
|
|
|
keyboardHTML += '<span class="slideDown">关闭</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div class="inputZone">'; |
|
|
|
|
|
keyboardHTML += '<div>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">1</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">2</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">3</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">4</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">5</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">6</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">7</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">8</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">9</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="number">0</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="func backspace">删除</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">q</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">w</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">e</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">r</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">t</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">y</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">u</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">i</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">o</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">p</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div>'; |
|
|
|
|
|
keyboardHTML += '<span class="func toUpper">小写</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">a</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">s</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">d</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">f</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">g</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">h</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">j</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">k</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">l</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol semicolon">:</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">/</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">z</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">x</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">c</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">v</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">b</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">n</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="letter">m</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol comma">,</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol period">.</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '<div>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol underline">_</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">\'</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">"</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="blank">空格</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">@</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">$</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="symbol">&</span>'; |
|
|
|
|
|
keyboardHTML += '<span class="func inputCut">英文</span>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
keyboardHTML += '</div>'; |
|
|
|
|
|
|
|
|
let keyboardHTML = '' |
|
|
|
|
|
keyboardHTML += '<div class="virtualkeyboard">' |
|
|
|
|
|
keyboardHTML += '<div class="outputZone">' |
|
|
|
|
|
keyboardHTML += '<span class="zh-pinyin-letter"></span>' |
|
|
|
|
|
keyboardHTML += '<div class="outputZoneOp">' |
|
|
|
|
|
keyboardHTML += '<span class="outputZoneUp unclick">◀</span>' |
|
|
|
|
|
keyboardHTML += |
|
|
|
|
|
'<span class="outputZoneDown">▶</span><span class="page">1/1</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div class="keyboardOp">' |
|
|
|
|
|
keyboardHTML += '<ul class="output-ZH"></ul>' |
|
|
|
|
|
keyboardHTML += '<span class="slideDown">关闭</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div class="inputZone">' |
|
|
|
|
|
keyboardHTML += '<div>' |
|
|
|
|
|
keyboardHTML += '<span class="number">1</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">2</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">3</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">4</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">5</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">6</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">7</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">8</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">9</span>' |
|
|
|
|
|
keyboardHTML += '<span class="number">0</span>' |
|
|
|
|
|
keyboardHTML += '<span class="func backspace">删除</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">q</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">w</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">e</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">r</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">t</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">y</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">u</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">i</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">o</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">p</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div>' |
|
|
|
|
|
keyboardHTML += '<span class="func toUpper">小写</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">a</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">s</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">d</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">f</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">g</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">h</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">j</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">k</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">l</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol semicolon">:</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">/</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">z</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">x</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">c</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">v</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">b</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">n</span>' |
|
|
|
|
|
keyboardHTML += '<span class="letter">m</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol comma">,</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol period">.</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '<div>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol underline">_</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">\'</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">"</span>' |
|
|
|
|
|
keyboardHTML += '<span class="blank">空格</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">@</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">$</span>' |
|
|
|
|
|
keyboardHTML += '<span class="symbol">&</span>' |
|
|
|
|
|
keyboardHTML += '<span class="func inputCut">英文</span>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
keyboardHTML += '</div>' |
|
|
|
|
|
|
|
|
$(this).click((event) => { |
|
|
|
|
|
if (!['INPUT'].includes(event.target.tagName)) return; |
|
|
|
|
|
const keyboard = $('.virtualkeyboard'); |
|
|
|
|
|
|
|
|
$(this).click(event => { |
|
|
|
|
|
if (!['INPUT'].includes(event.target.tagName)) return |
|
|
|
|
|
const keyboard = $('.virtualkeyboard') |
|
|
if (!keyboard.length) { |
|
|
if (!keyboard.length) { |
|
|
$(keyboardHTML).click((e) => { |
|
|
|
|
|
const el = $(e.target); |
|
|
|
|
|
|
|
|
$(keyboardHTML) |
|
|
|
|
|
.click(e => { |
|
|
|
|
|
const el = $(e.target) |
|
|
switch (true) { |
|
|
switch (true) { |
|
|
case el.hasClass('number'): |
|
|
case el.hasClass('number'): |
|
|
case el.hasClass('letter'): |
|
|
case el.hasClass('letter'): |
|
|
pressNumberOrLetterKey(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
pressNumberOrLetterKey(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('symbol'): |
|
|
case el.hasClass('symbol'): |
|
|
pressSymbolKey(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
pressSymbolKey(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('word'): |
|
|
case el.hasClass('word'): |
|
|
outputZhWord(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
outputZhWord(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('backspace'): |
|
|
case el.hasClass('backspace'): |
|
|
backspace(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
backspace(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('toUpper'): |
|
|
case el.hasClass('toUpper'): |
|
|
simulateCapsLock(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
simulateCapsLock(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('inputCut'): |
|
|
case el.hasClass('inputCut'): |
|
|
switchInputLanguage(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
switchInputLanguage(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('outputZoneUp'): |
|
|
case el.hasClass('outputZoneUp'): |
|
|
pageUp(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
pageUp(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('outputZoneDown'): |
|
|
case el.hasClass('outputZoneDown'): |
|
|
pageDown(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
pageDown(e) |
|
|
|
|
|
break |
|
|
case el.hasClass('slideDown'): |
|
|
case el.hasClass('slideDown'): |
|
|
clearZhWords(); |
|
|
|
|
|
$('.virtualkeyboard').hide(); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
clearZhWords() |
|
|
|
|
|
$('.virtualkeyboard').hide() |
|
|
|
|
|
break |
|
|
case el.hasClass('blank'): |
|
|
case el.hasClass('blank'): |
|
|
pressBlankKey(e); |
|
|
|
|
|
break; |
|
|
|
|
|
|
|
|
pressBlankKey(e) |
|
|
|
|
|
break |
|
|
} |
|
|
} |
|
|
$(defaults.el).focus(); |
|
|
|
|
|
}).appendTo('body'); |
|
|
|
|
|
|
|
|
$(defaults.el).focus() |
|
|
|
|
|
}) |
|
|
|
|
|
.appendTo('body') |
|
|
} |
|
|
} |
|
|
keyboard.show(); |
|
|
|
|
|
defaults.el = event.target; |
|
|
|
|
|
event.stopPropagation(); |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
keyboard.show() |
|
|
|
|
|
defaults.el = event.target |
|
|
|
|
|
event.stopPropagation() |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
$('html,body') |
|
|
$('html,body') |
|
|
// 绑定点击事件,在点击键盘区域之外时隐藏键盘
|
|
|
// 绑定点击事件,在点击键盘区域之外时隐藏键盘
|
|
|
.click((e) => { |
|
|
|
|
|
const el = $(e.target); |
|
|
|
|
|
|
|
|
.click(e => { |
|
|
|
|
|
const el = $(e.target) |
|
|
if (!el.parents('.virtualkeyboard').length && !el.hasClass('word')) { |
|
|
if (!el.parents('.virtualkeyboard').length && !el.hasClass('word')) { |
|
|
clearZhWords(); |
|
|
|
|
|
$('.virtualkeyboard').hide(); |
|
|
|
|
|
|
|
|
clearZhWords() |
|
|
|
|
|
$('.virtualkeyboard').hide() |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
// 在键盘应用keyboardOp类的区域绑定拖动事件,使键盘可以移动位置
|
|
|
// 在键盘应用keyboardOp类的区域绑定拖动事件,使键盘可以移动位置
|
|
|
.on('mousedown', '.keyboardOp', down) |
|
|
.on('mousedown', '.keyboardOp', down) |
|
|
.on('touchstart', '.keyboardOp', down); |
|
|
|
|
|
} |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
.on('touchstart', '.keyboardOp', down) |
|
|
|
|
|
}, |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* 更新备选汉字显示区域 |
|
|
* 更新备选汉字显示区域 |
|
|
*/ |
|
|
*/ |
|
|
function updateZHWords(e) { |
|
|
function updateZHWords(e) { |
|
|
$('.virtualkeyboard .word').remove(); |
|
|
|
|
|
const inputVal = $('.virtualkeyboard .zh-pinyin-letter').text(); |
|
|
|
|
|
if (!inputVal) return; |
|
|
|
|
|
|
|
|
$('.virtualkeyboard .word').remove() |
|
|
|
|
|
const inputVal = $('.virtualkeyboard .zh-pinyin-letter').text() |
|
|
|
|
|
if (!inputVal) return |
|
|
// 根据输入过滤出拼音,找出拼音对应的汉字,使用Set去除重复的汉字
|
|
|
// 根据输入过滤出拼音,找出拼音对应的汉字,使用Set去除重复的汉字
|
|
|
const zhWordSet = new Set(); |
|
|
|
|
|
zhKeys.filter(key => key.indexOf(inputVal) === 0) |
|
|
|
|
|
.forEach((key) => { |
|
|
|
|
|
|
|
|
const zhWordSet = new Set() |
|
|
|
|
|
zhKeys |
|
|
|
|
|
.filter(key => key.indexOf(inputVal) === 0) |
|
|
|
|
|
.forEach(key => { |
|
|
for (let word of dictionary[key]) { |
|
|
for (let word of dictionary[key]) { |
|
|
zhWordSet.add(word); |
|
|
|
|
|
|
|
|
zhWordSet.add(word) |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
}) |
|
|
// 将Set中的汉字依次添加到汉字输出区域
|
|
|
// 将Set中的汉字依次添加到汉字输出区域
|
|
|
let count = 0; |
|
|
|
|
|
|
|
|
let count = 0 |
|
|
for (let zhWord of zhWordSet.values()) { |
|
|
for (let zhWord of zhWordSet.values()) { |
|
|
count++; |
|
|
|
|
|
$('<li class="word">').addClass(`${count > defaults.num ? 'hide' : ''}`).text(zhWord).appendTo('.output-ZH'); |
|
|
|
|
|
|
|
|
count++ |
|
|
|
|
|
$('<li class="word">') |
|
|
|
|
|
.addClass(`${count > defaults.num ? 'hide' : ''}`) |
|
|
|
|
|
.text(zhWord) |
|
|
|
|
|
.appendTo('.output-ZH') |
|
|
} |
|
|
} |
|
|
// 处理备选汉字区域分页,默认显示第一页并更新页码信息
|
|
|
// 处理备选汉字区域分页,默认显示第一页并更新页码信息
|
|
|
if (count < defaults.num) { |
|
|
if (count < defaults.num) { |
|
|
$('.virtualkeyboard .outputZoneDown').addClass('unclick'); |
|
|
|
|
|
|
|
|
$('.virtualkeyboard .outputZoneDown').addClass('unclick') |
|
|
} else { |
|
|
} else { |
|
|
$('.virtualkeyboard .outputZoneDown').removeClass('unclick'); |
|
|
|
|
|
|
|
|
$('.virtualkeyboard .outputZoneDown').removeClass('unclick') |
|
|
} |
|
|
} |
|
|
defaults.page = 1; |
|
|
|
|
|
$('.virtualkeyboard .outputZoneUp').addClass('unclick'); |
|
|
|
|
|
pageUpdate(count); |
|
|
|
|
|
|
|
|
defaults.page = 1 |
|
|
|
|
|
$('.virtualkeyboard .outputZoneUp').addClass('unclick') |
|
|
|
|
|
pageUpdate(count) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 清空汉字输出区域
|
|
|
// 清空汉字输出区域
|
|
|
function clearZhWords(e) { |
|
|
function clearZhWords(e) { |
|
|
$('.virtualkeyboard .word').remove(); |
|
|
|
|
|
$('.virtualkeyboard .zh-pinyin-letter').text(''); |
|
|
|
|
|
$('.outputZone').hide(); |
|
|
|
|
|
|
|
|
$('.virtualkeyboard .word').remove() |
|
|
|
|
|
$('.virtualkeyboard .zh-pinyin-letter').text('') |
|
|
|
|
|
$('.outputZone').hide() |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
@ -705,70 +712,76 @@ |
|
|
*/ |
|
|
*/ |
|
|
function dispatchInputEvent($el) { |
|
|
function dispatchInputEvent($el) { |
|
|
if (!$el || !$el.length) { |
|
|
if (!$el || !$el.length) { |
|
|
$el = $(defaults.el); |
|
|
|
|
|
|
|
|
$el = $(defaults.el) |
|
|
} |
|
|
} |
|
|
if ($el && $el.length) { |
|
|
if ($el && $el.length) { |
|
|
$el[0].dispatchEvent(new Event('input')); |
|
|
|
|
|
|
|
|
$el[0].dispatchEvent(new Event('input')) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 点击数字或字母按键响应函数
|
|
|
// 点击数字或字母按键响应函数
|
|
|
function pressNumberOrLetterKey(e) { |
|
|
function pressNumberOrLetterKey(e) { |
|
|
if (defaults.ZH) { |
|
|
if (defaults.ZH) { |
|
|
|
|
|
if ($(e.target).hasClass('number')) { |
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()) |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
// 中文输入状态下,如果按下的不是字母按键(数字键),认为是无意义输入
|
|
|
// 中文输入状态下,如果按下的不是字母按键(数字键),认为是无意义输入
|
|
|
if (!$(e.target).hasClass('letter')) return; |
|
|
|
|
|
$('.outputZone').show(); |
|
|
|
|
|
const inputVal = $('.virtualkeyboard .zh-pinyin-letter'); |
|
|
|
|
|
inputVal.text(inputVal.text() + $(e.target).text()); |
|
|
|
|
|
updateZHWords(e); |
|
|
|
|
|
|
|
|
if (!$(e.target).hasClass('letter')) return |
|
|
|
|
|
$('.outputZone').show() |
|
|
|
|
|
const inputVal = $('.virtualkeyboard .zh-pinyin-letter') |
|
|
|
|
|
inputVal.text(inputVal.text() + $(e.target).text()) |
|
|
|
|
|
updateZHWords(e) |
|
|
} else { |
|
|
} else { |
|
|
const focusEl = $(defaults.el); |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()); |
|
|
|
|
|
dispatchInputEvent(focusEl); |
|
|
|
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()) |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 空格按键响应函数
|
|
|
// 空格按键响应函数
|
|
|
function pressBlankKey(e) { |
|
|
function pressBlankKey(e) { |
|
|
const focusEl = $(defaults.el); |
|
|
|
|
|
focusEl.val(focusEl.val() + ' '); |
|
|
|
|
|
dispatchInputEvent(focusEl); |
|
|
|
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val() + ' ') |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* 输出汉字,即点击汉字元素事件响应函数 |
|
|
* 输出汉字,即点击汉字元素事件响应函数 |
|
|
*/ |
|
|
*/ |
|
|
function outputZhWord(e) { |
|
|
function outputZhWord(e) { |
|
|
const focusEl = $(defaults.el); |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()); |
|
|
|
|
|
dispatchInputEvent(focusEl); |
|
|
|
|
|
clearZhWords(); |
|
|
|
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()) |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
|
|
|
clearZhWords() |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* 符号按键响应函数 |
|
|
* 符号按键响应函数 |
|
|
*/ |
|
|
*/ |
|
|
function pressSymbolKey(e) { |
|
|
function pressSymbolKey(e) { |
|
|
const focusEl = $(defaults.el); |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()); |
|
|
|
|
|
dispatchInputEvent(focusEl); |
|
|
|
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val() + $(e.target).text()) |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* 删除键事件处理函数 |
|
|
* 删除键事件处理函数 |
|
|
*/ |
|
|
*/ |
|
|
function backspace(e) { |
|
|
function backspace(e) { |
|
|
const key = $('.virtualkeyboard .zh-pinyin-letter'); |
|
|
|
|
|
|
|
|
const key = $('.virtualkeyboard .zh-pinyin-letter') |
|
|
if (key.text()) { |
|
|
if (key.text()) { |
|
|
key.text(key.text().substring(0, key.text().length - 1)); |
|
|
|
|
|
updateZHWords(e); |
|
|
|
|
|
|
|
|
key.text(key.text().substring(0, key.text().length - 1)) |
|
|
|
|
|
updateZHWords(e) |
|
|
if (!key.text()) { |
|
|
if (!key.text()) { |
|
|
clearZhWords(e); |
|
|
|
|
|
|
|
|
clearZhWords(e) |
|
|
} |
|
|
} |
|
|
} else { |
|
|
} else { |
|
|
const focusEl = $(defaults.el); |
|
|
|
|
|
focusEl.val(focusEl.val().substring(0, focusEl.val().length - 1)); |
|
|
|
|
|
dispatchInputEvent(focusEl); |
|
|
|
|
|
|
|
|
const focusEl = $(defaults.el) |
|
|
|
|
|
focusEl.val(focusEl.val().substring(0, focusEl.val().length - 1)) |
|
|
|
|
|
dispatchInputEvent(focusEl) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -776,20 +789,20 @@ |
|
|
function switchInputLanguage() { |
|
|
function switchInputLanguage() { |
|
|
// 如果是要转换为中文输入法且当前大写开启,先转换大小写输入模式
|
|
|
// 如果是要转换为中文输入法且当前大写开启,先转换大小写输入模式
|
|
|
if (!defaults.ZH && defaults.upperCase) { |
|
|
if (!defaults.ZH && defaults.upperCase) { |
|
|
simulateCapsLock(); |
|
|
|
|
|
|
|
|
simulateCapsLock() |
|
|
} |
|
|
} |
|
|
defaults.ZH = !defaults.ZH; |
|
|
|
|
|
|
|
|
defaults.ZH = !defaults.ZH |
|
|
if (defaults.ZH) { |
|
|
if (defaults.ZH) { |
|
|
$('.inputCut').text('中文'); |
|
|
|
|
|
$('.semicolon').text(':'); |
|
|
|
|
|
$('.comma').text(','); |
|
|
|
|
|
$('.period').text('。'); |
|
|
|
|
|
|
|
|
$('.inputCut').text('中文') |
|
|
|
|
|
$('.semicolon').text(':') |
|
|
|
|
|
$('.comma').text(',') |
|
|
|
|
|
$('.period').text('。') |
|
|
} else { |
|
|
} else { |
|
|
clearZhWords(); |
|
|
|
|
|
$('.inputCut').text('英文'); |
|
|
|
|
|
$('.semicolon').text(':'); |
|
|
|
|
|
$('.comma').text('/'); |
|
|
|
|
|
$('.period').text('.'); |
|
|
|
|
|
|
|
|
clearZhWords() |
|
|
|
|
|
$('.inputCut').text('英文') |
|
|
|
|
|
$('.semicolon').text(':') |
|
|
|
|
|
$('.comma').text('/') |
|
|
|
|
|
$('.period').text('.') |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -797,62 +810,68 @@ |
|
|
function simulateCapsLock(e) { |
|
|
function simulateCapsLock(e) { |
|
|
// 切换大小写时,如果当前是中文输入模式,则切换
|
|
|
// 切换大小写时,如果当前是中文输入模式,则切换
|
|
|
if (defaults.ZH) { |
|
|
if (defaults.ZH) { |
|
|
switchInputLanguage(); |
|
|
|
|
|
|
|
|
switchInputLanguage() |
|
|
} |
|
|
} |
|
|
defaults.upperCase = !defaults.upperCase; |
|
|
|
|
|
const letters = $('.virtualkeyboard .letter'); |
|
|
|
|
|
|
|
|
defaults.upperCase = !defaults.upperCase |
|
|
|
|
|
const letters = $('.virtualkeyboard .letter') |
|
|
if (defaults.upperCase) { |
|
|
if (defaults.upperCase) { |
|
|
letters.each(function (index, el) { |
|
|
letters.each(function (index, el) { |
|
|
$(el).text($(el).text().toUpperCase()); |
|
|
|
|
|
}); |
|
|
|
|
|
$('.toUpper').text('大写'); |
|
|
|
|
|
clearZhWords(); |
|
|
|
|
|
|
|
|
$(el).text($(el).text().toUpperCase()) |
|
|
|
|
|
}) |
|
|
|
|
|
$('.toUpper').text('大写') |
|
|
|
|
|
clearZhWords() |
|
|
} else { |
|
|
} else { |
|
|
letters.each(function (index, el) { |
|
|
letters.each(function (index, el) { |
|
|
$(el).text($(el).text().toLowerCase()); |
|
|
|
|
|
}); |
|
|
|
|
|
$('.toUpper').text('小写'); |
|
|
|
|
|
|
|
|
$(el).text($(el).text().toLowerCase()) |
|
|
|
|
|
}) |
|
|
|
|
|
$('.toUpper').text('小写') |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 拼音输入时翻到下一页
|
|
|
// 拼音输入时翻到下一页
|
|
|
function pageUp(e) { |
|
|
function pageUp(e) { |
|
|
const list = $('.virtualkeyboard .word'); |
|
|
|
|
|
|
|
|
const list = $('.virtualkeyboard .word') |
|
|
if (defaults.page > 1) { |
|
|
if (defaults.page > 1) { |
|
|
defaults.page--; |
|
|
|
|
|
|
|
|
defaults.page-- |
|
|
list.each(function (index, el) { |
|
|
list.each(function (index, el) { |
|
|
if (index < defaults.num * defaults.page && index >= defaults.num * (defaults.page - 1)) { |
|
|
|
|
|
$(el).show(); |
|
|
|
|
|
|
|
|
if ( |
|
|
|
|
|
index < defaults.num * defaults.page && |
|
|
|
|
|
index >= defaults.num * (defaults.page - 1) |
|
|
|
|
|
) { |
|
|
|
|
|
$(el).show() |
|
|
} else { |
|
|
} else { |
|
|
$(el).hide(); |
|
|
|
|
|
|
|
|
$(el).hide() |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
$(e.target).siblings().removeClass('unclick'); |
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
$(e.target).siblings().removeClass('unclick') |
|
|
if (defaults.page === 1) { |
|
|
if (defaults.page === 1) { |
|
|
$(e.target).addClass('unclick'); |
|
|
|
|
|
|
|
|
$(e.target).addClass('unclick') |
|
|
} |
|
|
} |
|
|
pageUpdate(list.length); |
|
|
|
|
|
|
|
|
pageUpdate(list.length) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// 拼音输入时翻到下一页
|
|
|
// 拼音输入时翻到下一页
|
|
|
function pageDown(e) { |
|
|
function pageDown(e) { |
|
|
const list = $('.virtualkeyboard .word'); |
|
|
|
|
|
const len = Math.ceil(list.length / defaults.num); |
|
|
|
|
|
|
|
|
const list = $('.virtualkeyboard .word') |
|
|
|
|
|
const len = Math.ceil(list.length / defaults.num) |
|
|
if (defaults.page < len) { |
|
|
if (defaults.page < len) { |
|
|
defaults.page++; |
|
|
|
|
|
|
|
|
defaults.page++ |
|
|
list.each(function (index, el) { |
|
|
list.each(function (index, el) { |
|
|
if (index < defaults.num * defaults.page && index >= defaults.num * (defaults.page - 1)) { |
|
|
|
|
|
$(el).show(); |
|
|
|
|
|
|
|
|
if ( |
|
|
|
|
|
index < defaults.num * defaults.page && |
|
|
|
|
|
index >= defaults.num * (defaults.page - 1) |
|
|
|
|
|
) { |
|
|
|
|
|
$(el).show() |
|
|
} else { |
|
|
} else { |
|
|
$(el).hide(); |
|
|
|
|
|
|
|
|
$(el).hide() |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
$(e.target).siblings().removeClass('unclick'); |
|
|
|
|
|
|
|
|
}) |
|
|
|
|
|
$(e.target).siblings().removeClass('unclick') |
|
|
if (defaults.page === len) { |
|
|
if (defaults.page === len) { |
|
|
$(e.target).addClass('unclick'); |
|
|
|
|
|
|
|
|
$(e.target).addClass('unclick') |
|
|
} |
|
|
} |
|
|
pageUpdate(list.length); |
|
|
|
|
|
|
|
|
pageUpdate(list.length) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
@ -861,27 +880,29 @@ |
|
|
* @param count 匹配汉字数目 |
|
|
* @param count 匹配汉字数目 |
|
|
*/ |
|
|
*/ |
|
|
function pageUpdate(count) { |
|
|
function pageUpdate(count) { |
|
|
$('.virtualkeyboard .page').text(defaults.page + '/' + (Math.ceil(count / defaults.num) || '1')); |
|
|
|
|
|
|
|
|
$('.virtualkeyboard .page').text( |
|
|
|
|
|
defaults.page + '/' + (Math.ceil(count / defaults.num) || '1'), |
|
|
|
|
|
) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function down(e) { |
|
|
function down(e) { |
|
|
if ($(e.target).hasClass('word')) return; |
|
|
|
|
|
e.preventDefault(); |
|
|
|
|
|
const event = e.type.match('mouse') ? e : e.originalEvent.changedTouches[0]; |
|
|
|
|
|
defaults.offsetX = (event.pageX - $('.virtualkeyboard')[0].offsetLeft); |
|
|
|
|
|
defaults.offsetY = (event.pageY - $('.virtualkeyboard')[0].offsetTop); |
|
|
|
|
|
|
|
|
if ($(e.target).hasClass('word')) return |
|
|
|
|
|
e.preventDefault() |
|
|
|
|
|
const event = e.type.match('mouse') ? e : e.originalEvent.changedTouches[0] |
|
|
|
|
|
defaults.offsetX = event.pageX - $('.virtualkeyboard')[0].offsetLeft |
|
|
|
|
|
defaults.offsetY = event.pageY - $('.virtualkeyboard')[0].offsetTop |
|
|
$('html,body') |
|
|
$('html,body') |
|
|
.on('mousemove', move) |
|
|
.on('mousemove', move) |
|
|
.on('mouseup', up) |
|
|
.on('mouseup', up) |
|
|
.on('touchmove', move) |
|
|
.on('touchmove', move) |
|
|
.on('touchend', up); |
|
|
|
|
|
|
|
|
.on('touchend', up) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function move(e) { |
|
|
function move(e) { |
|
|
e.preventDefault(); |
|
|
|
|
|
const event = e.type.match('mouse') ? e : e.originalEvent.changedTouches[0]; |
|
|
|
|
|
$('.virtualkeyboard')[0].style.left = (event.pageX - defaults.offsetX) + 'px'; |
|
|
|
|
|
$('.virtualkeyboard')[0].style.top = (event.pageY - defaults.offsetY) + 'px'; |
|
|
|
|
|
|
|
|
e.preventDefault() |
|
|
|
|
|
const event = e.type.match('mouse') ? e : e.originalEvent.changedTouches[0] |
|
|
|
|
|
$('.virtualkeyboard')[0].style.left = event.pageX - defaults.offsetX + 'px' |
|
|
|
|
|
$('.virtualkeyboard')[0].style.top = event.pageY - defaults.offsetY + 'px' |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function up() { |
|
|
function up() { |
|
@ -889,6 +910,6 @@ |
|
|
.off('mousemove', move) |
|
|
.off('mousemove', move) |
|
|
.off('mouseup', up) |
|
|
.off('mouseup', up) |
|
|
.off('touchmove', move) |
|
|
.off('touchmove', move) |
|
|
.off('touchend', up); |
|
|
|
|
|
|
|
|
.off('touchend', up) |
|
|
} |
|
|
} |
|
|
}); |
|
|
|
|
|
|
|
|
}) |