工作需要，asp+access建了个简单信息交互平台，需要在手机上手写签名存档，原是Base64直接入数据库，经过实践，数据太大，想改为图片存服务器IMG目录下，文件名最好是“ID_Date.now()”，路径及文件名入库“xj”表“xj_qm”字段里。我是初学者，不知怎么改，请专家帮忙改改代码。
数据库名：xj 表名:xj 表结构：ID自动编号，xj_qm短文本，用于记录签名图片的路径和文件名，还有几个表单项。
共三个asp文件和一个数据库。
表单代码：cscxj.asp
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<%Session.CodePage=65001%>
<!--#include file="../conn/conn.asp" -->
<!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" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>监测测试场小结</title>
<link rel="stylesheet" type="text/css" href="css/css.css" />
<style type="text/css">
<!--
.STYLE1 {
font-size: 20px;
color: #0000ff;
font-weight: bold;
}
.STYLE2 {
font-size: 22px;
color: #ff0000;
font-weight: bold;
}
-->
</style>
</head>
<body>
<form name="form1" action="xjup.asp" method="post" onSubmit="return IsValid();">
<table align="center" width="100%" border="0" cellpadding="0" cellspacing="0">
<tr height="10"><td align="center" colspan="2"></td></tr>
<tr>
<td bgcolor="#F2FDFF" align="center" width="100%" colspan="2"><p> </p><p><span class="STYLE2"><b>测试场小结</b></span></p></td>
</tr>
<tr height="20"><td colspan="2"></td></tr>
<tr>
<td align="left" colspan="2"><table width="90%"><tr><td><div><p><b>各位测试场主任：</b></p> 请如实小结本次监测的情况，提出对今后监测工作的建议，填报相应栏目后，点击底部的“<font color="#006600"><b><u>去签名</u></b></font>”，签好名后“<font color="#006600"><b><u>提交签名</u></b></font>”，最后“<font color="#006600"><b><u>查看(核对)您填报的小结</u></b></font>”。<p> <font color="#ff0000"><b>注意：</b>每次监测只填报一次小结(有小学、初中的要分别填报)！</font></P></div></td></tr></table>
</td></tr>
<tr height="20"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">监测年级：</td>
<td align="left" width="70%"> <select name="grade" id="grade" style="height:30px;width:60%;">
<option value="">==请选择年级==</option>
<%sql="select * from grade"
set rs1=server.createobject("ADODB.Recordset")
rs1.open sql,conn,1,1
do while not rs1.eof
%>
<option value=<%=rs1("gradename")%>><%=rs1("gradename")%></option>
<%
rs1.movenext
loop
rs1.Close
set rs1=nothing
%>
</select></td>
</tr>
<tr height="20"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">测试场名称：</td>
<td align="left" width="70%">
<select name="category" id="category" onChange="manageChange(this.value)">
<option value="">=先选类别=</option>
<%sql="select * from category"
set rs=server.createobject("ADODB.Recordset")
rs.open sql,conn,1,1
do while not rs.eof
%>
<option value=<%=rs("categoryName")%>><%=rs("categoryName")%></option>
<%
rs.movenext
loop
rs.Close
set rs=nothing
%>
</select>
<select name="cscxjschool" id="manage">
<option value="">请选择测试场名称</option>
</select><p> <font color="#FF0000">*先选左边的类别，右边才会出现对应的</p><p>测试场名称！*</font></p></td>
</tr>
<tr height="15"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">情况小结：</td>
<td align="left" width="70%"><textarea name="cscxjqkxj" id="cscxjqkxj" style="height:70px;width:90%;"></textarea></td>
</tr>
<tr height="15"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">工作建议：</td>
<td align="left" width="70%"><textarea name="cscxjgzjy" id="cscxjgzjy" style="height:80px;width:90%;"></textarea></td>
</tr>
<tr height="15"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">测试场主任姓名：</td>
<td align="left" width="70%"><input type="text" name="cscxjname" id="cscxjname" style="height:30px;width:90%;"></td>
</tr>
<tr height="15"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%">联系电话：</td>
<td align="left" width="70%"><input type="text" name="cscxjtel" id="cscxjtel" style="height:30px;width:90%;"></td>
</tr>
<tr height="15"><td align="center" colspan="2"></td></tr>
<tr>
<td align="right" width="30%"></td>
<td align="left" width="70%"><div align="center" class="mt30"><input type="submit" name="submit" value="去签名" class="bnt_save" style="width:80%;"></div></td>
</tr>
<tr height="20"><td align="center" colspan="2"></td></tr>
</table>
</form>
</body>
</html>
签名代码：xjqm.asp
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<%Session.CodePage=65001%>
set rs = server.CreateObject("adodb.recordset")
sql = "select * from xj"
rs.open sql,conn,1,3
rs.addnew
rs("special")=ND
rs("grade")=Trim(Request.Form("grade"))
rs("cscxj_school")=Trim(Request.Form("cscxjschool"))
rs("cscxj_qkxj")=Trim(Request.Form("cscxjqkxj"))
rs("cscxj_gzjy")=Trim(Request.Form("cscxjgzjy"))
rs("cscxj_name")=Trim(Request.Form("cscxjname"))
rs("cscxj_tel")=Trim(Request.Form("cscxjtel"))
rs("cscxj_lfIP")=GetUserTrueIP()
rs("cscxj_tjtime")=Now()
rs.update
hid = rs("xj_id")
rs.close
set rs=nothing
%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<TITLE>手写签名</TITLE>
<link rel="stylesheet" type="text/css" href="css/css.css" />
<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="js/layer_mobile/layer.js"></script>
<style type="text/css">
#canvas{width:100%; height:200px; border:2px solid #0099FF; margin:0 auto; box-sizing:border-box; -moz-box-sizing:border-box; /* Firefox */-webkit-box-sizing:border-box;}
#canvas canvas{
display: block;
}
.save{height:50px; overflow:hidden; margin:0 auto; margin-top:10px; }
#clearCanvas{
float:left;
width: 49%;
height: 50px;
line-height: 50px;
text-align: center;
z-index: 1;
background-color:#0066FF;
font-size:16px;
color:#FFFFFF;
}
#saveCanvas{
float:right;
width: 49%;
height: 50px;
line-height: 50px;
text-align: center;
z-index: 1;
background-color:#FF0000;
font-size:16px;
color:#FFFFFF;
}
h5{ height:40px; line-height:40px; background-color:#CCCCCC; color:#333333; text-align:center}
.yc{ margin-top:30px; display:none}
</style>
</head>
<body>
<div id="canvas"></div>
<h5>请在上方蓝框内手写您的姓名</h5>
<div class="save">
<p id="clearCanvas">清除重写</p>
<p id="saveCanvas">提交签名</p>
</div>
<div style="text-align:center; margin-top:30px; font-size:18px; font-weight:bold" id="anco"></div>
<div class="main_90 yc">
<button type="submit" class="red_save" onClick="window.location.href='cscxjck.asp?id=<%=hid%>'">查看(核对)您填报的小结</button>
</div>
<script type="text/javascript">
window.onload = function() {
bihua=0;
new lineCanvas({
el: document.getElementById("canvas"),//绘制canvas的父级div
clearEl: document.getElementById("clearCanvas"),//清除按钮
saveEl: document.getElementById("saveCanvas"),//保存按钮
linewidth:2,//线条粗细，选填
color:"black",//线条颜色，选填
background:"#ffffff"//线条背景，选填
});
};
function lineCanvas(obj) {
this.linewidth = 1;
this.color = "#000000";
this.background = "#ffffff";
for (var i in obj) {
this[i] = obj[i];
};
this.canvas = document.createElement("canvas");
this.el.appendChild(this.canvas);
this.cxt = this.canvas.getContext("2d");
this.canvas.width = this.el.clientWidth;
this.canvas.height = this.el.clientHeight;
this.cxt.fillStyle = this.background;
this.cxt.fillRect(0, 0, this.canvas.width, this.canvas.width);
this.cxt.strokeStyle = this.color;
this.cxt.lineWidth = this.linewidth;
this.cxt.lineCap = "round";
//开始绘制
this.canvas.addEventListener("touchstart", function(e) {
event.preventDefault();// 阻止浏览器默认事件，防止手写的时候拖动屏幕，重要
this.cxt.beginPath();
this.cxt.moveTo(e.changedTouches[0].pageX, e.changedTouches[0].pageY);
}.bind(this), false);
//绘制中
this.canvas.addEventListener("touchmove", function(e) {
event.preventDefault();// 阻止浏览器默认事件，防止手写的时候拖动屏幕，重要
this.cxt.lineTo(e.changedTouches[0].pageX, e.changedTouches[0].pageY);
this.cxt.stroke();
}.bind(this), false);
//结束绘制
this.canvas.addEventListener("touchend", function() {
bihua++;
event.preventDefault();// 阻止浏览器默认事件，防止手写的时候拖动屏幕，重要
this.cxt.closePath();
}.bind(this), false);
//清除画布
this.clearEl.addEventListener("click", function() {
bihua=0;
this.cxt.clearRect(0, 0, this.canvas.width, this.canvas.height);
}.bind(this), false);
//保存图片，直接转base64
this.saveEl.addEventListener("click", function() {
//alert(bihua);
if (bihua == 0) {
alert("签名不能为空");
return;
};
var imgBase64 = this.canvas.toDataURL();
console.log(imgBase64);
//下面开始ajax入库
$.ajax({
type:"post",
//也可以是带action的url:'save.asp?action=save',
url:'ajax-cscxj.asp',
data: {id:<%=hid%>,qm_pic:imgBase64},
dataType:'text',// dataType:"html",//服务器返回的数据类型。
timeout:10000,//10秒通信超时
beforeSend:function(xhr){
// alert('ajax通信，将信息post出去请稍等');或是放loding等待提示
layer.open({type: 2});//等待提示层
},
success:function(ywx){//请求成功，得到返回信息
//提示弹窗alert(ywx);
layer.closeAll();//很成功，关闭等待提示层
layer.open({content: ywx,skin: 'msg',time: 2});//提示弹窗
$("#canvas").hide();
$("h5").hide();
$(".yc").show();
$(".save").hide();
$("#anco").html(ywx);
},//success结束
error:function(xhr){//请求出错,
//alert('ajax通信异常，请稍后再试');
layer.closeAll();//关闭等待提示层
layer.open({
content: 'ajax通信异常，请稍后再试'
,skin: 'msg'
,time: 2 //2秒后自动关闭
});
},
});
//ajax_end
//alert("ok");
}.bind(this), false);
};
</script>
</body>
</html>
传数据库代码：ajax.asp
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!-- #include file="../conn/conn.asp"-->
<%
id = int(Request.form("id"))
qm_pic =Trim(Request.form("qm_pic"))
set rs = server.CreateObject("adodb.recordset")
sql = "select * from [xj] where xj_id = "&id&""
rs.open sql,conn,1,3
rs("xj_qm") = request.Form("qm_pic")
rs.update
rs.Close
Set rs = Nothing
response.Write("签名成功")
conn.close
set conn=nothing
%>
