源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)

  • 时间:2020-08-23 13:52 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
最近做项目,我负责做网页前端,客户需要利用触摸屏进行操作,不外接鼠标键盘,但要求能录入文字,包括数字,英文,中文。思考了一下,决定用JS实现虚拟键盘。 首先上网搜索了一下JS虚拟键盘,在经过仔细筛选后,相中了VirtualKeyboard,一款功能强大的JS虚拟键盘插件。 先简单介绍一下VirtualKeyboard,它内置了100多种键盘布局和200多种输入法,9套可选皮肤方案,而且支持自建输入法,功能相当强大。 先附上下载地址,目前的最新版本3.94:[url=http://www.corallosoftware.it/Download/download.html]http://www.corallosoftware.it/Download/download.html[/url] 本教程使用的是3.71就不单独提供下载了,有需要的朋友可以下载我修改完毕的,在文章的最后 下载下来先查看它的演示文档,依次打开Jsvk\jscripts\demo_inline.html,看到虚拟键盘做的还是蛮漂亮的,而且支持中文拼音输入,完全符合预期。如下图所示: [img]http://files.jb51.net/file_images/article/201410/201410111138032.jpg[/img] 集成到项目中去,说干就干!   首先将Jsvk\jscripts目录下的文件复制到项目中去,文本文件和html演示文件可以删掉。   项目页面中引用JS文件:
[url=http://jsbeautifier.org/]http://jsbeautifier.org/[/url],将JS文件中的代码复制到输入框中,点击一下按钮,解压完成。ctrl+a,ctrl+c复制到新的JS文件中,OK,可以阅读了。搜索”<select“关键字,一下子就找到了,代码如下: "<select id=\"kb_langselector\"></select>" + "<select id=\"kb_mappingselector\"></select>"   kb_mappingselector是键盘布局选择框的ID,kb_langselector是输入法选择框的ID,kb_langselector就是我们要的ID。   有了ID,就可以修改了,因为是动态创建的,只有当创建完成以后才可以取到它的ID,于是我把代码写到了虚拟键盘加载之后。   以下代码用到了JQuery框架,需要先引用JQuery方可正常使用。
[url=http://www.1sucai.cn/jiaoben/228716.html]http://www.1sucai.cn/jiaoben/228716.html[/url]
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部