用户控件ascx代码:
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="Keyboard.ascx.cs" Inherits="Keyboard" %> <link href="js/jquery.keypad.alt.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/jquery.1.3.2.min.js"></script> <script type="text/javascript" src="js/jquery.keypad.js"></script> <script type="text/javascript"> $(function () { //初始化keypad插件 $('#defaultKeypad').keypad({prompt:'',keypadOnly:false,layout:$.keypad.qwertyLayout}); }); </script> <input id="defaultKeypad" type="password" name="pwd" maxlength="12" style="150px"/>
用户控件ascx.cs代码:
public partial class Keyboard : System.Web.UI.UserControl { protected void Page_Load(object sender, EventArgs e) { } /// <summary> /// 返回虚拟键盘取得的值 /// </summary> /// <returns></returns> public string getvalue() { System.Collections.Specialized.NameValueCollection nv = new System.Collections.Specialized.NameValueCollection(System.Web.HttpContext.Current.Request.Form); return nv.GetValues("pwd")[0].ToString(); } }
Default.aspx代码:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <%@ Register src="Keyboard.ascx" tagname="Keyboard" tagprefix="uc1" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>无标题页</title> <style type="text/css"> .style1 { width: 144px; height: 36px; } .style2 { width: 152px; } </style> </head> <body> <form id="form1" runat="server"> <div> <table align="center" cellpadding="0" cellspacing="0" > <tr> <td class="style2"> 用 户 名:</td> <td class="style1"> <asp:TextBox ID="txtUserName" runat="server"></asp:TextBox> </td> <td class="style3"> <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="txtUserName" ErrorMessage="*"></asp:RequiredFieldValidator> </td> </tr> <tr> <td class="style2"> 密 码:</td> <td class="style1"> <uc1:Keyboard ID="Keyboard1" runat="server" /> </td> <td class="style3"> </td> </tr> <tr> <td class="style2"> </td> <td class="style1"> <asp:Button ID="Button1" runat="server" Text="登录" onclick="Button1_Click" /> <input id="Button2" type="button" value="退出" onclick="window.close();"/></td> <td class="style3"> </td> </tr> </table> <br /> <br /> </div> </form> </body> </html>
Default.aspx.cs代码:
protected void Button1_Click(object sender, EventArgs e) { if (Keyboard1.getvalue() != "") { //获取用户输入的信息, 包括登录名和通过软键盘输入的面 string info ="登录名:"+txtUserName.Text+"登录密码:"+Keyboard1.getvalue(); //弹出提示, 以便测试查看 ClientScript.RegisterStartupScript(this.GetType(), "", "alert('"+info+"');", true); } else { ClientScript.RegisterStartupScript(this.GetType(), "", "alert('请输入密码');", true); } }
示例中用到的js文件下载:
http://pan.baidu.com/s/1kVyPxZp
最终效果图: