Supports the query function keyboard and a simple soft keyboard. The keyboard style is completely defined in an independent css file and can be beautified by yourself.
(Supports the soft keyboard from the query)
(Simple software disk)
Default parameters of the plug-in
Copy codeThe Code is as follows:
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"
}, // Plug-in related element naming
Listmultiple: true, // select whether to expand
Simplekeyboard: true, // whether to display uppercase letters
Onlykeyboard: false, // whether the query function is provided
Maxlength: null, // maximum length that can be entered
Requestdataurl: null, // The post address of the queried data
Oncompleted: function (data) {}, // set this time when the task is completed
Onkeydown: function (data) {}// this event is triggered when you press the button
};
Use of plug-ins
Usage
Copy codeThe Code is as follows:
<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>
Add a text box to the page. method 2
<Input type = "text" class = "querytxt"/>
Use the plug-in for the text box whose class is querytxt
Copy codeThe Code is as follows:
<Script type = "text/javascript">
$ (". Querytxt"). softkeyboard ()
</Script>
Change Related Parameters
Copy codeThe Code is as follows:
$ (". Querytxt"). softkeyboard ({
Simplekeyboard: true,
Listmultiple: true,
Maxlength: 10,
Onkeydown: function (d) {alert (d )},
Requestdataurl: "GetData. ashx ",
Onlykeyboard: true
})
The json data format returned by GetData. ashx is similar to the following:
Copy codeThe Code is as follows:
[{Code: "DL", name: "Dalian" },{ code: "DT", name: "Datong" },{ code: "DL", name: "Dali"}]
