欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

ASP.NET jQuery 實例2 (表單中使用回車在TextBox之間向下移動)

 更新時間：2012年01月13日 22:20:10   作者：  
每次當用戶在一個文本框輸入完數(shù)據(jù)后，更希望在敲入回車鍵后，焦點會自動移動到下一個文本框
通過下面的代碼可以實現(xiàn)這種切換的效果。

首先我們來看界面：
界面代碼：
復制代碼 代碼如下:

<body>
<form id="form1" runat="server">
<div align="center">
<fieldset style="width: 400px; height: 200px;">
<table cellpadding="3" cellspacing="3" border="0">
<tr>
<td>
<asp:Label ID="lblName" Text="姓名: " runat="server"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtName" Width="200px" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblAddress" Text="地址: " runat="server"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtAddress" Width="200px" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblContact" Text="聯(lián)系電話: " runat="server"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtContact" Width="200px" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
<asp:Label ID="lblEmail" Text="電子郵箱: " runat="server"></asp:Label>
</td>
<td>
<asp:TextBox ID="txtEmail" Width="200px" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td>
</td>
<td>
<asp:Button ID="btnSubmit" Text="提交" runat="server" />
<asp:Button ID="btnReset" Text="重置" runat="server" />
</td>
</tr>
</table>
</fieldset>
</div>
</form>
</body>

腳本代碼：
復制代碼 代碼如下:

<head runat="server">
<title>Recipe2</title>
<script src="Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("input:text:first").focus(); // TextBox轉(zhuǎn)換成html控件為<input type="text"/>
$("input:text").bind("keydown", function (e) {
if (e.which == 13) { // 獲取Enter鍵值
e.preventDefault(); // 阻止表單按Enter鍵默認行為，防止按回車鍵提交表單
var nextIndex = $("input:text").index(this) + 1;
$("input:text")[nextIndex].focus();
}
});
$("#<%=btnReset.ClientID%>").click(function () {
$("form")[0].reset();
});
});
</script>
</head>

相關文章

最新評論