介绍 & lt; ! DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0,过渡//EN"
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"比;
& lt; html xmlns=癶ttp://www.w3.org/1999/xhtml"比;
& lt; head>
,& lt; title> $ . ajax()方法发送请求& lt;/title>
,& lt; script 类型=拔谋?javascript", src=癹s/jquery-1.4.1.js"祝辞& lt;/script>
,& lt; style 类型=拔谋?css"比;
,身体
,{
,,字体大小:13 px;
,}
,.divFrame
,{
,,宽度:225 px;
边境才能:solid 1 px # 666;
,}
.divFrame .divTitle
,{
,,填充:5 px;
,,背景颜色:# eee;
,,身高:23 px;
,}
,.divFrame .divTitle 跨度
,{
浮:,才能离开;
,,填充:2 px;
,,padding-top: 5 px;
,}
.divFrame .divContent
,{
,,填充:8 px;
,,text-align:中心;
,}
.divFrame .divContent .clsShow
,{
,,字体大小:14 px;
,,行高:2.0 em;
,}
,.divFrame .divContent .clsShow .clsError
,{
,,字体大小:13 px;
边境才能:solid 1 px # cc3300;
,,填充:2 px;
,,显示:没有;
,,margin-bottom: 5 px;
,,背景颜色:# ffe0a3;
,}
,. txt
,{
边境才能:# 666,1 px 固体;
,,填充:2 px;
,,宽度:150 px;
,,margin-right: 3 px;
,}
,.btn
,{
边境才能:# 666,1 px 固体;
,,填充:2 px;
,,宽度:50 px;
,}
,& lt;/style>
,& lt; script 类型=拔谋?javascript"比;
,$ (function (), {
美元才能(“# txtName") .focus();//输入焦点
美元才能(“# txtName") .keydown (function (事件),{
if 才能;(event.which ==,“13”),{//回车键,移动光标到密码框
,,(“# txtPass")美元.focus ();
,,}
,,});
美元才能(“# txtPass") .keydown (function (事件),{
if 才能;(event.which ==,“13”),{//回车键,用. ajax提交表单
,,(“# btnLogin") .trigger美元(“click");
,,}
,,});
美元才能(“# btnLogin") .click (function (),{,//暗锹肌卑磁サセ魇录?/才能获取用户名称
var 才能;strTxtName =, encodeURI ($ (“# txtName") .val ());//才能获取输入密码
var 才能;strTxtPass =, encodeURI ($ (“# txtPass") .val ());//才能开始发送数据
,$ . ajax
,,({//请求登录处理页
,,,url:“Login.aspx",,//登录处理页
,,,数据类型:“html",
,,//传送请求数据
,,,数据:{,txtName: strTxtName,, txtPass:, strTxtPass },
,,,成功:function (strValue),{,//登录成功后返回的数据
,,//根据返回值进行状态显示
,,if (==strValue “True"),{//注意是真的,不是正确的
,,,美元(“.clsShow") . html(“操作提示,登录成功!“,+,strValue);
,,}
,,else {
,,,(“# divError")美元,告诉(). html(“用户名或密码错误!“,+,strValue);
,,}
,,}
})才能
})才能
,})
,& lt;/script>
& lt;/head>
& lt; body>
,& lt; form id=癴rmUserLogin"比;
,& lt; div 类=癲ivFrame"比;
,& lt; div 类=癲ivTitle"比;
& lt;才能span>用户登录& lt;/span>
,& lt;/div>
,& lt; div 类=癲ivContent"比;
& lt;才能div 类=癱lsShow"比;
& lt;才能div id=癲ivError",类=癱lsError"比;
& lt;才能/div>
& lt;才能div>
,,名称:& lt; input id=皌xtName",类型=皌ext",类=皌xt",/祝辞& lt;/div>
& lt;才能div>
,,密码:& lt; input id=皌xtPass",类型=皃assword",类=皌xt",/祝辞& lt;/div>
& lt;才能div>
,,& lt; input id=癰tnLogin",类型=癰utton", value=暗锹肌?类=癰tn",/祝辞,
,,& lt; input id=癰tnReset",类型=皉eset", value=叭∠?类=癰tn",/比;
& lt;才能/div>
& lt;才能/div>
,& lt;/div>
,& lt;/div>
,& lt;/form>
& lt;/body>
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
null
这篇文章将为大家详细讲解有关jQuery如何实现形式表单基于ajax无刷新提交方法,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。
本文实例讲述了jQuery实现形式表单基于ajax无刷新提交方法。分享给大家供大家参考,具体如下:
首先,新建登录。html页面:
