基于jquery的多功能軟鍵盤(pán)插件
更新時(shí)間：2012年07月25日 22:32:30 作者：
支持查詢(xún)功能的鍵盤(pán)和簡(jiǎn)單得軟鍵盤(pán)，鍵盤(pán)樣式完全在獨(dú)立的css文件中定義，可以自行美化
支持查詢(xún)功能的鍵盤(pán)和簡(jiǎn)單得軟鍵盤(pán)，鍵盤(pán)樣式完全在獨(dú)立的css文件中定義，可以自行美化。
插件的默認(rèn)參數(shù)
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"
}, //插件的相關(guān)元素命名
listmultiple: true, //select是否展開(kāi)
simplekeyboard: true, //是否顯示大寫(xiě)字母
onlykeyboard: false, //是否帶查詢(xún)功能
maxlength: null, //可輸入的最大長(zhǎng)度
requestdataurl: null, //查詢(xún)數(shù)據(jù)的post地址
oncompleted: function (data) { }, //完成時(shí)出發(fā)此時(shí)間
onkeydown: function (data) { } //按鍵時(shí)出發(fā)此事件
};
插件的使用方法
使用方法
<link href="softkeyboard.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script src="jquery.softkeyboard.js" type="text/javascript"></script>
在頁(yè)面中加入一個(gè)文本框使用方法2
<input type="text" class="querytxt" />
為class為querytxt的文本框使用插件
<script type="text/javascript">
$(".querytxt").softkeyboard()
</script>
更改相關(guān)參數(shù)
$(".querytxt").softkeyboard({
simplekeyboard: true,
listmultiple: true,
maxlength: 10,
onkeydown: function (d) { alert(d) },
requestdataurl: "GetData.ashx",
onlykeyboard: true
})
其中GetData.ashx返回的json數(shù)據(jù)格式類(lèi)似如下
[{code:"DL",name:"大連"},{code:"DT",name:"大同"},{code:"DL",name:"大理"}]
插件的默認(rèn)參數(shù)
復(fù)制代碼 代碼如下:
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"
}, //插件的相關(guān)元素命名
listmultiple: true, //select是否展開(kāi)
simplekeyboard: true, //是否顯示大寫(xiě)字母
onlykeyboard: false, //是否帶查詢(xún)功能
maxlength: null, //可輸入的最大長(zhǎng)度
requestdataurl: null, //查詢(xún)數(shù)據(jù)的post地址
oncompleted: function (data) { }, //完成時(shí)出發(fā)此時(shí)間
onkeydown: function (data) { } //按鍵時(shí)出發(fā)此事件
};
插件的使用方法
使用方法
復(fù)制代碼 代碼如下:
<link href="softkeyboard.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.6.2.js" type="text/javascript"></script>
<script src="jquery.softkeyboard.js" type="text/javascript"></script>
在頁(yè)面中加入一個(gè)文本框使用方法2
<input type="text" class="querytxt" />
為class為querytxt的文本框使用插件
復(fù)制代碼 代碼如下:
<script type="text/javascript">
$(".querytxt").softkeyboard()
</script>
更改相關(guān)參數(shù)
復(fù)制代碼 代碼如下:
$(".querytxt").softkeyboard({
simplekeyboard: true,
listmultiple: true,
maxlength: 10,
onkeydown: function (d) { alert(d) },
requestdataurl: "GetData.ashx",
onlykeyboard: true
})
其中GetData.ashx返回的json數(shù)據(jù)格式類(lèi)似如下
復(fù)制代碼 代碼如下:
[{code:"DL",name:"大連"},{code:"DT",name:"大同"},{code:"DL",name:"大理"}]
您可能感興趣的文章:
- 解析android中隱藏與顯示軟鍵盤(pán)及不自動(dòng)彈出鍵盤(pán)的實(shí)現(xiàn)方法
- Js之軟鍵盤(pán)實(shí)現(xiàn)(js源碼)
- Android中監(jiān)聽(tīng)軟鍵盤(pán)顯示狀態(tài)實(shí)現(xiàn)代碼
- Android 顯示和隱藏軟鍵盤(pán)的方法(手動(dòng))
- JS實(shí)現(xiàn)自定義簡(jiǎn)單網(wǎng)頁(yè)軟鍵盤(pán)效果代碼
- Android軟鍵盤(pán)彈出時(shí)的界面控制方法
- jquery比較簡(jiǎn)潔的軟鍵盤(pán)特效實(shí)現(xiàn)方法
- Android WebView無(wú)法彈出軟鍵盤(pán)的原因及解決辦法
- Android屏蔽EditText軟鍵盤(pán)的方法
- 手機(jī)軟鍵盤(pán)彈出時(shí)影響布局的解決方法
相關(guān)文章
Jquery each方法跳出循環(huán),并獲取返回值(實(shí)例講解)
這篇文章主要是對(duì)Jquery each方法跳出循環(huán),并獲取返回值進(jìn)行了詳細(xì)的介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
基于jquery實(shí)現(xiàn)鼠標(biāo)左右拖動(dòng)滑塊滑動(dòng)附源碼下載
這篇文章主要介紹了基于jquery實(shí)現(xiàn)鼠標(biāo)左右拖動(dòng)滑塊滑動(dòng)附源碼下載 的相關(guān)資料,需要的朋友可以參考下2015-12-12
這篇文章主要介紹了Jquery 在頁(yè)面加載后執(zhí)行的幾種方式,需要的朋友可以參考下2014-03-03
layer是一款近年來(lái)備受青睞的web彈層組件，她具備全方位的解決方案，致力于服務(wù)各水平段的開(kāi)發(fā)人員，您的頁(yè)面會(huì)輕松地?fù)碛胸S富友好的操作體驗(yàn)，接下來(lái)通過(guò)本文給大家介紹layui常用方法，需要的朋友參考下2016-07-07
jquery 無(wú)限級(jí)聯(lián)菜單案例分享
phpcms的地區(qū)級(jí)聯(lián)菜單，感覺(jué)寫(xiě)的挺有意思于是自己也實(shí)現(xiàn)了個(gè)，感興趣的各位路過(guò)的可以參考下哈，希望本例可以幫助到你2013-03-03
jquery實(shí)現(xiàn)樹(shù)形二級(jí)菜單實(shí)例代碼
這篇文章主要介紹了jquery實(shí)現(xiàn)樹(shù)形二級(jí)菜單實(shí)例代碼，有需要的朋友可以參考一下2013-11-11
基于jquery的設(shè)置頁(yè)面文本框 只能輸入數(shù)字的實(shí)現(xiàn)代碼
之前寫(xiě)過(guò)的方法有缺陷，可以輸入空格?，F(xiàn)在將空格也屏蔽了。就是在之前的代碼里加入了過(guò)濾空格的功能。2011-04-04
jquery Ajax 實(shí)現(xiàn)加載數(shù)據(jù)前動(dòng)畫(huà)效果的示例代碼
本篇文章主要是對(duì)jquery Ajax實(shí)現(xiàn)加載數(shù)據(jù)前動(dòng)畫(huà)效果的示例代碼進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2014-02-02
Eclipse引入jquery報(bào)錯(cuò)如何解決
有朋友問(wèn)我，在是使用eclipse的過(guò)程中遇到了這么一個(gè)問(wèn)題--eclipse導(dǎo)入jquery包后報(bào)錯(cuò)——究竟是什么原因?qū)е逻@一問(wèn)題發(fā)生的呢？該如何解決此問(wèn)題呢？下面小編給大家?guī)?lái)了解決辦法，不妨一起看看吧2015-12-12
這篇文章主要介紹了jquery手風(fēng)琴特效插件,效果非常棒，需要的朋友可以參考下2015-02-02