ASP源码—Ajax+Jquery无刷新留言本v1.0.zip资源-CSDN文库

共23个文件

jpg：17个

mdb：2个

asp：1个

版权申诉

96 浏览量 2023-10-14 22:31:14 上传评论收藏 307KB ZIP 举报

ASP源码—Ajax+Jquery无刷新留言本 v1.0.zip是一款基于ASP技术构建的、利用Ajax和jQuery实现无刷新交互的简单留言本应用。这个项目的核心在于它结合了服务器端的脚本语言ASP（Active Server Pages）与客户端的JavaScript库jQuery，实现了页面在不重新加载的情况下进行数据交换和更新，提供了更流畅、更友好的用户体验。 ASP是微软公司开发的一种服务器端脚本环境，用于创建动态交互式网页。通过ASP，开发者可以在HTML代码中嵌入VBScript或JScript代码，服务器端处理这些代码后，返回生成的HTML页面给客户端浏览器。在本案例中，ASP可能负责处理用户提交的留言数据，如用户名、内容、时间等，并将其存储到数据库中。 Ajax（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。它通过JavaScript发送异步HTTP请求到服务器，获取数据，然后在客户端用JavaScript处理这些数据并更新DOM（Document Object Model）来改变页面内容。在本例中，Ajax可能被用来实现用户提交留言后，即时在页面上显示新留言，而无需刷新整个页面。 jQuery是一个高效、简洁且功能丰富的JavaScript库，简化了HTML文档遍历、事件处理、动画以及Ajax交互。在ASP源码—Ajax+Jquery无刷新留言本中，jQuery库可能被用于封装Ajax调用，简化异步请求的编写，同时提供方便的DOM操作和动画效果，比如当新留言添加时，可能使用jQuery的淡入淡出效果来吸引用户的注意力。压缩包内的文件名132684513070687270可能是指一个唯一标识符或者时间戳，这通常是数据库记录ID或者是文件创建或修改的时间戳。在实际应用中，这个文件可能是ASP源码、数据库配置文件、CSS样式表、JavaScript脚本文件或者是其他支持此留言本功能的资源文件。这个项目展示了如何结合ASP、Ajax和jQuery技术来构建一个实时互动的Web应用。ASP处理服务器端逻辑，Ajax负责无刷新的数据交换，而jQuery则简化了前端交互的实现。对于学习Web开发的人来说，这是一个很好的实践案例，可以深入了解服务器端脚本与客户端脚本如何协同工作，以及如何利用Ajax技术提高用户体验。

资源推荐

资源详情

资源评论

收起资源包目录

ASP源码—Ajax+Jquery无刷新留言本 v1.0.zip （23个子文件）

132684513070687270

site8002

jquery-1.4.1.min.js 70KB

data

site.mdb 236KB

img

t5.jpg 24KB

t6.jpg 33KB

btn2.jpg 17KB

del.jpg 16KB

er.jpg 22KB

fb.jpg 25KB

btn.jpg 17KB

t3.jpg 36KB

bg1.jpg 11KB

tt.jpg 11KB

t1.jpg 25KB

bg.jpg 27KB

t4.jpg 28KB

t7.jpg 24KB

logo.jpg 50KB

t2.jpg 25KB

bg2.jpg 13KB

current.png 8KB

index.html 7KB

site.asp 3KB

site.mdb 284KB

<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="js/jquery-1.4.1.min.js" type="text/javascript"></script> <title>留言板</title> <style type="text/css"> body { font-size:12px; margin:0; padding:0; line-height:20px; } #main { width:800px; margin:0 auto; padding:0 } #top { width:100%; background-image:url("img/logo.jpg"); height:193px; margin:0; background-repeat:no-repeat; } .tx { width:150px; height:150px; float:left; border:#bbbbbb 1px solid; padding:1px; } .tx2 { width:150px; height:150px; float:left; border:#bbbbbb 1px solid; padding:1px; margin-left:5px; margin-top:5px; cursor:pointer } .bg1 { background-image:url('img/bg1.jpg'); background-repeat:no-repeat; height:7px; } .bg2 { background-image:url('img/bg2.jpg'); height:20px; background-repeat:no-repeat; } a:link { color: #FFFFFF; } a:visited { color: #FFFFFF; } a:hover { color: Gray; } a:active { color:Gray; } #po a:link { color: #227ab7; } #po a:visited { color: #227ab7; } #po a:hover { color: Gray; } #po a:active { color:Gray; } </style> <script type="text/javascript"> var step="0"; $(function() { init(); //按钮事件 $("#btn").mouseover(function(){ $(this).attr("src","img/btn2.jpg"); }).mouseout(function(){ $(this).attr("src","img/btn.jpg"); }); //昵称 $("#nc").focus(function() { if($(this).val()=="请填写昵称，不填为匿名") { $(this).val(""); } $(this).css("color","Black"); }).blur(function(){ if($(this).val()=="") { $(this).val("请填写昵称，不填为匿名"); $(this).css("color","#d3d0d0"); } }); //内容 $("#nr").focus(function() { if($(this).val()=="在这里写上留言内容，不能留空或不填") { $(this).val(""); } $(this).css("color","Black"); }).blur(function(){ if($(this).val()=="") { $(this).val("在这里写上留言内容，不能留空或不填"); $(this).css("color","#d3d0d0"); } }); //头像 var tx="img/t1.jpg"; $(".tx2").click(function(){ $(".tx2").empty(); $(this).append($("<img src='img/current.png'>")); tx=$(this).attr("va"); }); //发布留言 $("#btn").click(function(){ if($("#nr").val()!=""&&$("#nr").val()!="在这里写上留言内容，不能留空或不填") { var nc=$("#nc").val(); if(nc==""||nc=="请填写昵称，不填为匿名") { nc="匿名者"; } var nr=$("#nr").val(); $.post("site.asp",{"action":"add","nc":nc,"nr":nr,"tx":tx},function(data,status){ if(status=="success") { init(); } }); } }); //登陆系统 var dt="你尚未登陆，只能留言，不能操作！用户名：<input type='text' id='uid' />　　密码：<input type='password' id='pwd'/>　<input type='button' onclick='login()' value='登陆'/>"; $("#dh").html(dt); }); function init() { //初始化 $.post("site.asp",{"action":"get"},function(data,status)//初始化留言 { if(status=="success") { $("#lys").empty(); var DA=data.split("彟"); for(var i=0;i<DA.length-1;i++) { var ly=DA[i].split("囃"); var div=$("<div style='float:left; margin-top:5px;'><div class='tx'><img src='img/"+ly[3]+"'/></div><div style='float:left; width:640px;margin-left:5px;'><table width='100%' cellpadding='0' cellspacing='0'><tr class='bg1'><td colspan='2' ></td></tr><tr style='background-color:#f1f1f1; '><td colspan='2' style='padding:5px'>"+ly[1]+"<hr style='border:#d6d3d3 1px dotted'/><span style='color:#0000C4'>"+ly[0]+" 于 "+ly[2]+" 发表</span></td></tr><tr class='bg2'><td colspan='2' ></td></tr></table><img src='img/del.jpg' style='cursor:pointer;display:block;float:left' onclick='del("+ly[4]+",this)'><img src='img/er.jpg' class='er' style='display:none;float:left'/></div></div>"); $("#lys").append(div); } } }); $.post("site.asp",{"action":"check"},function(data,status)//检验登陆状态 { if(status=="success") { if(data!="0") { $("#dh").empty(); $("#dh").html(data+"，欢迎你！　　<a href='#' onclick='changePWD()'>修改密码</a>　　　<a href='#' onclick='logout()'>注销</a>"); step="1"; $(".er").css("display","none"); } } }); } //登陆 function login() { var uid=$("#uid").val(); var pwd=$("#pwd").val(); $.post("site.asp",{"action":"login","uid":uid,"pwd":pwd},function(data,status) { if(status=="success") { if(data=="1")//登陆成功 { $("#dh").empty(); $("#dh").html(uid+"，欢迎你！　　<a href='#' onclick='changePWD()'>修改密码</a>　　　<a href='#' onclick='logout()'>注销</a>"); step="1"; $(".er").css("display","none"); } } }); } //修改密码 function changePWD() { } //删除 function del(id,obj) { $(".er").css("display","none"); if(step=="1") { if(confirm("确定删除这则留言？")) { $.post("site.asp",{"action":"del","id":id},function(data,status){ if(status=="success") { } }); init(); } } else { $(obj).next().css("display","block"); } } //注销 function logout() { $("#dh").empty(); var dt="你尚未登陆，只能留言，不能操作！用户名：<input type='text' id='uid' />　　密码：<input type='password' id='pwd'/>　<input type='button' onclick='login()' value='登陆'/>"; $("#dh").html(dt); $.post("site.asp",{"action":"logout"},function(data,status){ if(status=="success") { step="0"; } }); } </script> </head> <body> <div style="width:100%; height:32px; background-color:#061b50; padding-top:8px; color:#FFFFFF"> <div id="dh" style="margin:0 auto; width:800px"></div> </div> <div id="main"> <div id="top"></div> <div id="lys"> </div> <div style="width:100%; height:200px; float:left;"> <img src="img/fb.jpg" /> <div id="po" style="text-align:center; width:100%;float:left">制作者： <a href="http://www.sd131.com " target="_blank">踏雪寻梅</a> <a href="http://www.top136.com " target="_blank">1厅3排6座</a> </div> <input type="text" id="nc" size="30" value="请填写昵称，不填为匿名" style="color:#d3d0d0"/><br /> <textarea style="width:99%;　color:#d3d0d0" id="nr" rows="10" >在这里写上留言内容，不能留空或不填</textarea><br /> <div class='tx2' style="background-image:url('img/t1.jpg')" va="t1.jpg" ><img src="img/current.png" /></div><div class='tx2' va="t2.jpg" style="background-image:url('img/t2.jpg')"></div><div class='tx2' style="background-image:url('img/t3.jpg')" va="t3.jpg"></div><div class='tx2' style="background-image:url('img/t4.jpg')" va="t4.jpg"></div><div class='tx2' style="background-image:url('img/t5.jpg')" va="t5.jpg"></div><div class='tx2' style="background-image:url('img/t6.jpg')" va="t6.jpg"></div><div class='tx2' style="background-image:url('img/t7.jpg')" va="t7.jpg"> </div> <table width="100%"><tr><td style="text-align:right"><img src="img/btn.jpg" style="cursor:pointer" id="btn" /></tr></td></table> </div> </div> </body> </html>

评论收藏

内容反馈

版权申诉