AJAX的jQuery实现入门(二)

可爱的贝贝麻麻

可爱的贝贝麻麻

2016-02-19 16:58

下面是个AJAX的jQuery实现入门(二)教程,撑握了其技术要点,学起来就简单多了。赶紧跟着图老师小编一起来看看吧!

要写入数据库,我们知道的最简单的就是注册了, 就做个最简单的注册表单, 看看是如何提交数据的.

我们先写如下的html代码,三个文本框,一个按钮:

p昵称:input type="text" name="username" id="sname" //p
p密码:input type="text" name="password" id="spwd" //p
p邮箱:input type="text" name="email" id="smail" //p
pbutton id="sub"提交/button/p

看到没, 我们不用表单, 甚至不用submit.

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

然后再看看jquery代码:

(document).ready(function(){
("#sub").click(function(){ //当点击提交按钮时触发
var usr = ("#sname").val(); //获取到三个文本框的值
var pas = ("#spwd").val();
var mail = ("#smail").val();
.ajax({
type:"POST", //用POST方法
url:"reg.asp", //向这个页面传值
data:"username="+usr+"&password="+pas+"&email="+mail, //传的数据是这样的
success:function(){
("#msg").show("slow"); //操作成功后显示一个提示
},
error:function(){
alert("出现问题, 请重试"); //出现问题时提示
}
})
})
})

关键在data这里, 假如我们在文本框里填了Robin,123456,rlog@live.com 那么data就成了: username=Robin&password=123456&email=rlog@live.com ,几乎刚开始学习网页制作的同学都知道这是干嘛用的. 他通过url把页面里的值传给后端程序去处理.那么后端怎么处理呢? 看看下面的asp代码reg.asp的内容, 还是让老狼帮我写的,唉真是猴子掰玉米.学多少忘多少.

%
dim conn
dim connstr
dim db
db="reg.mdb"
Set conn = Server.CreateObject("ADODB.Connection")
connstr="Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" & Server.MapPath(db)
conn.Open connstr
set rs=server.CreateObject("adodb.recordset")
sql="select * from reguser"
rs.open sql,conn,2,3
rs.addnew
rs("username")=request.Form("username")
rs("password")=request.Form("password")
rs("email")=request.Form("email")
rs.update
rs.close
set rs=nothing
response.Write("添加成功!")
conn.close
set conn=nothing
%

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

好了就这么多, 什么? 还有数据库! 老天我不是搞开发的,其实也很简单了. 一张表,三个字段username,password,email. over! 千万别把这个例子直接拿去就用喽, 连最基本的前端验证的没有, 密码还是明文.

这个恐怕已经简单到不能再简单了,如果你还是不能自己做成功, 看看我做好的例子吧. 下次我们把读写一起来玩.

展开更多 50%)
分享

猜你喜欢

AJAX的jQuery实现入门(二)

Web开发
AJAX的jQuery实现入门(二)

jquery $.ajax入门应用二

Web开发
jquery $.ajax入门应用二

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

AJAX的jQuery实现入门(一)

Web开发
AJAX的jQuery实现入门(一)

jQuery入门[5]-AJAX

Web开发
jQuery入门[5]-AJAX

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

jquery $.ajax入门应用一

Web开发
jquery $.ajax入门应用一

使用jQuery简化Ajax开发 Ajax开发入门

Web开发
使用jQuery简化Ajax开发 Ajax开发入门

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

c#中构建异常处理

c#中构建异常处理

HTML 限制文本框只能输入数字 onkeyup+onafterpaste

HTML 限制文本框只能输入数字 onkeyup+onafterpaste
下拉加载更多内容 ↓