<!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>
源代码-Ajax+Jquery无刷新留言本 v1.0.zip
14 浏览量
2024-05-06
16:36:17
上传
评论
收藏 307KB ZIP 举报
源代码-Ajax+Jquery无刷新留言本 v1.0.zip （23个子文件） 
132684513070687270 site8002 js 
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资源评论
