基于jquery的多功能软键盘插件

2024-04-26 05:46:48

支持查询功能的键盘和简单得软键盘，键盘样式完全在独立的css文件中定义，可以自行美化。

（支持从查询的软键盘）

（简单的软件盘）

插件的默认参数

代码如下:

jquery.fn.softkeyboard.defaults = {
names: {
_delbtn: "skbdel",
_clearbtn: "skbclear",
_querybtn: "skbquery",
_closebtn: "skbclose",
_letterbtn: "skbbtn",
_maindiv: "skbsoftkeyboard",
_leftdiv: "skbleft",
_rightdiv: "skbright",
_keyboarddiv: "skbkeyboard",
_operationdiv: "skboperation",
_codetxt: "skbcode",
_resultsselect: "skbresults",
_postparamcode: "sfbcode",
_clearbtnviewname: "clear",
_delbtnviewname: "delete",
_querybtnviewname: "query",
_closebtnviewname: "close"
}, //插件的相关元素命名
listmultiple: true, //select是否展开
simplekeyboard: true, //是否显示大写字母
onlykeyboard: false, //是否带查询功能
maxlength: null, //可输入的最大长度
requestdataurl: null, //查询数据的post地址
oncompleted: function (data) { }, //完成时出发此时间
onkeydown: function (data) { } //按键时出发此事件
};

插件的使用方法
使用方法

代码如下:

在页面中加入一个文本框使用方法2
<input type="text" class="querytxt" />
为class为querytxt的文本框使用插件

代码如下:

更改相关参数

代码如下:

$(".querytxt").softkeyboard({
simplekeyboard: true,
listmultiple: true,
maxlength: 10,
onkeydown: function (d) { alert(d) },
requestdataurl: "GetData.ashx",
onlykeyboard: true
})

其中GetData.ashx返回的json数据格式类似如下

代码如下:

[{code:"DL",name:"大连"},{code:"DT",name:"大同"},{code:"DL",name:"大理"}]

Js之软键盘实现(js源码)

鉴于安全性的考虑,不少网站在登录输入密码时都采用了软键盘,避免一些键盘记录工具和木马对击键的捕捉.项目中也有这个需求,就分享给大家了,贴个效果图上来..有兴趣的朋友可以收藏....如果觉得功能有点庞大,只需要数字小键盘的朋友,可参考代码精简.下载大键盘: http://www.cnblogs.com/Files/sccxszy/softKey.rar小键盘:http://www.cnblogs.com/Files/sccxszy/smallSoftkey.rar小键盘: 效果还原:Default
jquery比较简洁的软键盘特效实现方法

本文实例讲述了jquery比较简洁的软键盘特效实现方法.分享给大家供大家参考.具体实现方法如下: 运行效果图如下: 1. html主要部分如下: 复制代码代码如下: <div id="container"> <textarea id="write" rows="6" cols="60"></textarea> <ul id="keyboard"> &
Android中监听软键盘显示状态实现代码

/**监听软键盘状态 * @param activity * @param listener */ public static void addOnSoftKeyBoardVisibleListener(Activity activity, final OnSoftKeyBoardVisibleListener listener) { final View decorView = activity.getWindow().getDecorView(); decorView.getViewTree
Android屏蔽EditText软键盘的方法

本文实例讲述了Android屏蔽EditText软键盘的方法.分享给大家供大家参考.具体如下: java代码如下: InputMethodManager imm = (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE); imm.hideSoftInputFromWindow(myEdit.getWindowToken(), 0); //myEdit是你的EditText对象可以通过下面方法恢复显示: boolea
Android 显示和隐藏软键盘的方法(手动)

在Android开发中,经常会有一个需求,做完某项操作后,隐藏键盘,也即让Android中的软键盘不显示.今天,和大家分享如何利用代码来实现对Android的软件盘的隐藏.显示的操作. 1.方法一(如果输入法在窗口上已经显示,则隐藏,反之则显示) InputMethodManager imm = (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE); imm.toggleSoftInput(0, InputMeth
Android WebView无法弹出软键盘的原因及解决办法

requestFoucs();无效. requestFoucsFromTouch();无效. webview.setTouchListener:无效. 问题所在: 继承WebView时,注意构造方法: public CommonWebView(Context context) { super(context); init(); } public CommonWebView(Context context, AttributeSet attrs) { super(context, attrs);
手机软键盘弹出时影响布局的解决方法

移动端软键盘弹出时影响布局该如何解决 1)前段时间作的移动端页面,因为高度只有1页所以用了height:100%;width:100%; ios下点击输入框弹出软键盘时,布局没有大影响. 当输入框可能被软键盘压到时,在一部分安卓下却出了问题,华为自带浏览器和UC会有布局上的问题. 原因可能是因为,软键盘弹出时,改变了height,使height:100%,不能达到原来的高度. 解决办法: $(document).ready(function () { $('body').height($('bo
JS实现自定义简单网页软键盘效果代码

本文实例讲述了JS实现自定义简单网页软键盘效果.分享给大家供大家参考,具体如下: 这是一款自定义的简单点的网页软键盘,没有使用任何控件,仅是为了练习JavaScript编写水平,安全性方面没有过多考虑,有顾虑的可以不用,目的是学习,希望对您有用处. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-simple-web-keybord-style-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C/
解析android中隐藏与显示软键盘及不自动弹出键盘的实现方法

1.//隐藏软键盘 ((InputMethodManager)getSystemService(INPUT_METHOD_SERVICE)).hideSoftInputFromWindow(WidgetSearchActivity.this.getCurrentFocus().getWindowToken(), InputMethodManager.HIDE_NOT_ALWAYS); 2.//显示软键盘,控件ID可以是EditText,TextView ((InputMethodMa
Android软键盘弹出时的界面控制方法

本文实例讲述了Android软键盘弹出时的界面控制方法.分享给大家供大家参考,具体如下: 有时候androidactivity弹出软键盘后布局改变下面有三种模式可以改变软键盘弹出以后的显示形式模式一:压缩模式软键盘弹出以后,会压缩原先的大小我们可以在AndroidManifet.xml中对Activity进行设置.如: android:windowSoftInputMode="stateUnchanged|adjustResize" 模式二:平移模式软键盘弹出以后,不会压缩原先

基于jquery的多功能软键盘插件

相关推荐

随机推荐