上传头像

来源：互联网发布：江苏中国淘宝第一村编辑：程序博客网时间：2024/05/29 09:05

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <base href="<%=basePath%>">

    <title>My JSP '3.jsp' starting page</title>

   <meta http-equiv="pragma" content="no-cache">
   <meta http-equiv="cache-control" content="no-cache">
   <meta http-equiv="expires" content="0">
   <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
   <meta http-equiv="description" content="This is my page">
   
   <script type="text/javascript" src="jquery-1.4.2.js" ></script>
   <script>

       function setImagePreview(avalue) {
var docObj=document.getElementById("doc");

var imgObjPreview=document.getElementById("preview");
if(docObj.files &&docObj.files[0])
{
//火狐下，直接设img属性
imgObjPreview.style.display = 'block';
imgObjPreview.style.width = '80px';
imgObjPreview.style.height = '80px';
//imgObjPreview.src = docObj.files[0].getAsDataURL();

//火狐7以上版本不能用上面的getAsDataURL()方式获取，需要一下方式
imgObjPreview.src = window.URL.createObjectURL(docObj.files[0]);
}
else
{
//IE下，使用滤镜
docObj.select();
var imgSrc = document.selection.createRange().text;
var localImagId = document.getElementById("localImag");
//必须设置初始大小
localImagId.style.width = "150px";
localImagId.style.height = "180px";
//图片异常的捕捉，防止用户修改后缀来伪造图片
try{
localImagId.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
localImagId.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = imgSrc;
}
catch(e)
{
alert("您上传的图片格式不正确，请重新选择!");
return false;
}
imgObjPreview.style.display = 'none';
document.selection.empty();
}
return true;
}
           $(function(){
                           var flag=false;
                           $("#name").blur(function(){
                           $("#vname").empty();
                               var name=$("#name").val();
                               if(name==null || name==""){
                                       $("#name").after("<span style='color: red;' id='vname'>姓名不能为空</span>");
                                       return flag;
                               }else{
                                   $.post("person/selectbyname",{"name":name},function(dd){
                                       if(dd=="ok"){
                                               $("#name").after("<span style='color: red;' id='vname'>用户名已存在</span>");
                                       return flag;
                                       }else{
                                           $("#name").after("<span style='color: red;' id='vname'>√</span>");
                                       flag=true;
                                       return flag;
                                       }
                                   },"text");
                               }
                           });

                      var flag4=false;
                   $("#phoneNumber").blur(function(){
                   $("#vphoneNumber").empty();
                   var str=/^0?1[3|4|5|8][0-9]\d{8}$/;
                       var   phoneNumber=$("#phoneNumber").val();
                               if(phoneNumber==null || phoneNumber==""){
                                       $("#phoneNumber").after("<span style='color: red;' id='vphoneNumber'>电话不能为空</span>");
                                       return flag4;
                               }else{
                               if(str.test(phoneNumber)){
                                   $("#phoneNumber").after("<span style='color: red;' id='vphoneNumber'>√</span>");
                                   flag4=true;
                                   return flag4;
                                   }else{
                                   $("#phoneNumber").after("<span style='color: red;' id='vphoneNumber'>格式不正确</span>");
                                   return flag4;
                                   }
                               }
                   });

                          var flag2=false;
                   $("#birthday").blur(function(){
                   $("#vbirthday").empty();
                   var str=/^((((1[6-9]|[2-9]\d)\d{2})-(0?[13578]|1[02])-(0?[1-9]|[12]\d|3[01]))|(((1[6-9]|[2-9]\d)\d{2})-(0?[13456789]|1[012])-(0?[1-9]|[12]\d|30))|(((1[6-9]|[2-9]\d)\d{2})-0?2-(0?[1-9]|1\d|2[0-8]))|(((1[6-9]|[2-9]\d)(0[48]|[2468][048]|[13579][26])|((16|[2468][048]|[3579][26])00))-0?2-29-))$/;
                       var   birthday=$("#birthday").val();
                               if(birthday==null || birthday==""){
                                       $("#birthday").after("<span style='color: red;' id='vbirthday'>日期不能为空</span>");
                                       return flag2;
                               }else{
                               if(str.test(birthday)){
                                   $("#birthday").after("<span style='color: red;' id='vbirthday'>√</span>");
                                   flag2=true;
                                   return flag2;
                                   }else{
                                   $("#birthday").after("<span style='color: red;' id='vbirthday'>格式不正确</span>");
                                   return flag2;
                                   }
                               }
                   });

                               var flag3=false;

                   $("#address").blur(function(){
                   $("#vaddress").empty();
                       var   address=$("#address").val();
                               if(address==null || address==""){
                                       $("#address").after("<span style='color: red;' id='vaddress'>地址不能为空</span>");
                                       return flag3;
                               }else{
                                   $("#address").after("<span style='color: red;' id='vaddress'>√</span>");
                                   flag3=true;

                                   return flag3;
                               }
                   });

                   $("#tj").click(function(){

                           return flag && flag2 && flag3 & flag4;

                       });
           })
   </script>
</head>

<body>
   添加新的联系人
<form action="person/insert" method="post" enctype="multipart/form-data">
   姓名：<input type="text" name="name" id="name"/><br/>
电话：<input type="text" name="phoneNumber" id="phoneNumber"/><br/>
生日：<input type="text" name="birthday" id="birthday"/><br/>
地址：<input type="text" name="address" id="address"/><br/>
<input type="hidden" name="uid" value="${uid }"/>
头像：        <table width="100%" border="0" cellspacing="0" cellpadding="0">
                   <tbody>
                       <tr>
                       <td height="101" align="center">
                       <div id="localImag"><img id="preview" width="150" height="180" style="display: block; width: 150px; height: 180px;"></div>
                       </td>
                       </tr>
                       <tr>
                       <td align="center" style="padding-top:10px;"><input type="file" name="souser" id="doc" style="width:150px;" onchange="javascript:setImagePreview();"></td>
                       </tr>
                       </tbody>
                   </table>
<input type="submit" value="提交" id="tj"/>
   </form>
</body>
</html>

阅读全文

0 0