添加留言页

⑤添加留言页

把index.asp另存为insert.asp，修改页面标题"留言板首页"为"填写留言"，删除一些表格，并在服务器面板中把除第一条Recordset(rs)以外的行为都选中后按上面的"-"号删除，完成后大概是这样：

光标定位到第三行的单元格里后点"Application"工具组里的"Record Insertion Form Wizard"图标(图63)，弹出"Record Insertion Form"对话框，删掉一些项，并作配置如下(没写的属性项均用默认值)：
Connection:conn
Insert into table:main
After inserting,go to:index.asp
Name{
Label:昵称:
}
Email{
Label:信箱:
}
Homepage{
Label:主页:
Default value:http://
}
QQ{
Submit as:Numeric
}
Content{
Label:内容:
Display as:Text area
}
ICON{
Display as:Hidden field
Default value:01
}
IP{
Display as:Hidden field
Default value:<%= Request.ServerVariables("REMOTE_ADDR") %>
}
除了上面提到的，其他项按上面的"-"号删除，并通过上三角和下调整各项的顺序，填好后如图所示

到这里添加留言的页面在功能上已完成了，下面是我调整一下表单项的位置并用CSS对文本框作了美化后的效果：

把头像图片所在的单元格的id设为icon(在单元格td标签内加上id="icon")，并添加下面的代码到css.css文档中：
input,textarea {
font-family: Verdana, "宋体";
font-size: 12px;
background-color: #DDDDDD;
height: 18px;
width: 150px;
border: 1px solid #333333;
}
textarea{
height:120px;
width:98%;
overflow:hidden;
}
#icon img{
margin:2px;
cursor:hand;
}
更有下面的脚本代码添加到insert.asp的head部分：
<script language="JavaScript">
<!--
window.onload=function (){//页面加载完毕时执行
var obj=document.form1;
obj.onmouseover=function(){//表单项(文本框、多行文本框)在鼠标移上时变换背景颜色的函数(函数①)
if(event.srcElement.tagName=="INPUT"||event.srcElement.tagName=="TEXTAREA")//判断当对象标签为input或textarea时执行
event.srcElement.style.backgroundColor="#EEEEEE";//对象背景颜色变换#EEEEEE
}
obj.onmouseout=function(){//表单项(文本框、多行文本框)在鼠标移出时变换背景颜色的函数(函数②)
if(event.srcElement.tagName=="INPUT"||event.srcElement.tagName=="TEXTAREA")//判断当对象标签为input或textarea时执行
event.srcElement.style.backgroundColor="#DDDDDD";//对象背景颜色变换#DDDDDD
}
icon.onclick=function(){//单击头像图片时把图片名中的数字传递到隐藏域ICON的函数(函数③)
obj.ICON.value=event.srcElement.src.match(/(0[1-6])(?=\.jpg)/g)[0];//将所点击的图片路径地址中的01-06赋值给隐藏域ICON
}
obj.onsubmit=function(){//验证表单的函数(函数④)
var error=""
if(obj.Name.value=="")error ="●昵称项不能为空\n\n";
if(obj.Email.value=="")error ="●信箱项不能为空\n\n";
else if(!/^\w(\w*\.*)*@(\w \.) \w{2,4}$/.test(obj.Email.value))error ="●信箱格式不正确\n\n";
if(obj.Homepage.value!=obj.Homepage.defaultValue&&!/^(http:\/\/[A-Za-z0-9\./=\?%\-&_~`@[\]\': !] )$/.test(obj.Homepage.value))error ="●网址格式不正确\n\n"
if(obj.QQ.value!=""&&!/^[1-9]\d{4,8}$/.test(obj.QQ.value))error ="●QQ号码只能是5位到9位的数字\n\n"
if(obj.Content.value=="")error ="●留言内容不能为空\n\n";
else if(obj.Content.value.length>1000){error ="●留言字符长度超出1000";obj.Content.value=obj.Content.value.substring(0,1000)}
if(error!=""){alert("错误提示：\n\n" error);return false;}
else return true;
}
}
//-->
</script>

假如无需表单项在鼠标事件发生时变换背景颜色，能够去掉函数①和②，假如嫌手写表单验证的代码太累，能够去掉函数④，然后到yaromat.com下载一个叫checkForm的插件，很难找到的话就从这个地址下：http://vip.5d.cn/Xmercy/form/checkform.mxp。插件下载后双击自动安装，最后在行为面板上点" "号，选择"yaromat>>check form"就能够用了，插件的使用很简单，这里就不多说了。
填写不正确时的警告

假如填写正确后提交是500错误，那就有可能是"Everyone"对数据库的操作权限太低，解决办法：
1)在数据库文档上右击，在快捷菜单中选择"属性"
2)转换到"安全"标签，作配置如下

假如更有错误，并且已确认之前的任何操作都正确无误，请按"Ctrl `"转换到源码视图，检查代码中是否出现一个<%@LANGUAGE="VBSCRIPT" CODEPAGE="936"%>和一个<%@LANGUAGE="VBSCRIPT"%>，有的话删掉<%@LANGUAGE="VBSCRIPT"%>。