只是为了演示使用ajaxSubmit异步上传图片及保存数

作者: 前端  发布:2019-09-06

注释掉的代码:一部分是后台数据合法验证用的,beforeSend这个方法是ajax请求执行前的相关操作(用于做loading比较多)
最后一步就是,每次数据提交完并且成功返回,getdigshtml()都要重新获取绑定下,这样就保证了数据的实时性。
演示代码需要asp环境,大家可以测试下。
打包下载地址:

@Controller
@RequestMapping(value = "/upload")
public class FileUploadController {
private Logger logger;
@RequestMapping(value = "upload.do", method = RequestMethod.POST)
public void fileUpload(HttpServletRequest request, HttpServletResponse response) {
Map<String, Object> resultMap = new HashMap<String, Object>();
String newRealFileName = null;
try {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
CommonsMultipartFile file = (CommonsMultipartFile) multipartRequest.getFile("file");
// 获得文件名:
String realFileName = file.getOriginalFilename();
if(file.getSize()/1024>=5*1024){
resultMap.put("status", 1);
resultMap.put("message", "图片不能大于5M");
}else{
System.out.println("获得文件名:" realFileName);
newRealFileName = FileUploadController.getNowTime() realFileName.substring(realFileName.indexOf("."));
// 获取路径
String ctxPath = request.getSession().getServletContext().getRealPath("//") "//temp//";
// 创建文件
File dirPath = new File(ctxPath);
if (!dirPath.exists()) {
dirPath.mkdir();
}
File uploadFile = new File(ctxPath newRealFileName);
FileCopyUtils.copy(file.getBytes(), uploadFile);
request.setAttribute("files", loadFiles(request));
resultMap.put("status", 0);
resultMap.put("fileName", newRealFileName);
}
} catch (Exception e) {
resultMap.put("status", 1);
resultMap.put("message", "图片上传出错");
logger.info("***** 图片上传出错 *****");
System.out.println(e);
} finally {
PrintWriter out = null;
try {
out = response.getWriter();
} catch (IOException e) {
e.printStackTrace();
}
//必须设置字符编码,否则返回json会乱码
response.setContentType("text/html;charset=UTF-8");
out.write(JSONSerializer.toJSON(resultMap).toString());
out.flush();
out.close();
}
}
}

</div>
<div class="control-group">
<label class="control-label">*商圈logo:</label>
<div class="controls" style="width:350px;">
<input type="file" name="file" id="file">
<div id="file_error"></div>
</div>
</div>
<div class="control-group">
<label class="control-label">*商圈英文名:</label>
<div class="controls" style="width: 350px;">
<input type="text" name="businessEname" id="businessEname" />
<div id="businessEname_error"></div>
</div>
</div>
<div class="form-actions">
<button type="button" id="imgSave" value="Validate" class="btn btn-primary">提交注册</button>
</div>
</form>
</div>
</div>
</div>
<div class="span1"></div>
</div>
</div>
<div class="container" style="background:white;">
<div class="row">
<div class="span12" style="margin-left: 25%;">
<p>© 2012 fingerknow.com <span>|</span><a href="#" rel="nofollow" >隐私条款</a><span>|</span><a href="#" rel="nofollow">服务条款</a><span>|</span><a href="#" rel="nofollow" >粤ICP备12003619号-1</a></p>
</div>
</div>
</div>
<script src="${ctx}/js/jquery-1.9.0.js"></script>
<script src="${ctx}/js/jquery.form.js"></script>
<script type="text/javascript">
/**
*
* V1.0
*/
$(document).ready(function() {

复制代码 代码如下: div class="digg" id="digg" div class="good" a href="#" p这个文档不错/p div class="bar" div id="g_img" style="width:70%"/div /div...

复制代码 代码如下:

@Controller
@RequestMapping(value = "/upload")
public class FileUploadController {
private Logger logger;
@RequestMapping(value = "upload.do", method = RequestMethod.POST)
public void fileUpload(HttpServletRequest request, HttpServletResponse response) {
Map<String, Object> resultMap = new HashMap<String, Object>();
String newRealFileName = null;
try {
MultipartHttpServletRequest multipartRequest = (MultipartHttpServletRequest) request;
CommonsMultipartFile file = (CommonsMultipartFile) multipartRequest.getFile("file");
// 获得文件名:
String realFileName = file.getOriginalFilename();
if(file.getSize()/1024>=5*1024){
resultMap.put("status", 1);
resultMap.put("message", "图片不能大于5M");
}else{
System.out.println("获得文件名:" realFileName);
newRealFileName = FileUploadController.getNowTime() realFileName.substring(realFileName.indexOf("."));
// 获取路径
String ctxPath = request.getSession().getServletContext().getRealPath("//") "//temp//";
// 创建文件
File dirPath = new File(ctxPath);
if (!dirPath.exists()) {
dirPath.mkdir();
}
File uploadFile = new File(ctxPath newRealFileName);
FileCopyUtils.copy(file.getBytes(), uploadFile);
request.setAttribute("files", loadFiles(request));
resultMap.put("status", 0);
resultMap.put("fileName", newRealFileName);
}
} catch (Exception e) {
resultMap.put("status", 1);
resultMap.put("message", "图片上传出错");
logger.info("***** 图片上传出错 *****");
System.out.println(e);
} finally {
PrintWriter out = null;
try {
out = response.getWriter();
} catch (IOException e) {
e.printStackTrace();
}
//必须设置字符编码,否则返回json会乱码
response.setContentType("text/html;charset=UTF-8");
out.write(JSONSerializer.toJSON(resultMap).toString());
out.flush();
out.close();
}
}
}

复制代码 代码如下:

<%@page import="com.fingerknow.project.vo.UserInformation"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath }" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ";
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>注册商圈</title>
<link href="${ctx}/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="${ctx}/bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<link rel="stylesheet" href="${ctx}/css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="${ctx}/css/jquery-ui.css" />
<link rel="stylesheet" href="${ctx}/css/uniform.css" />
<link rel="stylesheet" href="${ctx}/css/select2.css" />
<link rel="stylesheet" href="${ctx}/css/unicorn.main.css" />
<link rel="stylesheet" href="${ctx}/css/common.css" />
<%
response.setCharacterEncoding("utf-8");//这个是设置编码方式
response.setContentType("text/html");//这个是设置网页类型,为文本代码
UserInformation user=null;
String username="";
Integer userId=null;
if(request.getSession().getAttribute("userinfo")!=null){
user=(UserInformation)request.getSession().getAttribute("userinfo");
username=user.getUsername();
userId=user.getUserId();
}else{
username="请<a href=';";
}
%>
</head>
<body>
<div class="header-inner">
<div class="container">
<div class="row">
<div class=" page-header clearfix">
<div class="span11"> <h1 class="page-header" style="background:black;"><img alt="fingerknow" src="${ctx}/images/fingerknow.png" width=""><small>中文最大的购物经验分享平台</small></h1> </div>
<div class="span1"> <a href="#">首页</a> |<a href="#">帮助</a></div>
</div>
</div>
</div>
</div>
<div class="container" id="businessEname_div">
<div class="row">
<div class="span1"></div>
<div class="span10">
<div class="widget-box">
<div class="widget-title">
<span class="icon">
<i class="icon-align-justify"></i>
</span>
<h5>注册商圈</h5>
</div>

<div class="widget-content nopadding">
<form class="form-horizontal" method="post" action="${ctx}/upload/upload.do" id="uploadImgForm" enctype="multipart/form-data">
<div class="control-group" style="border: 0px solid red;">
<label class="control-label">*商圈名:</label>
<div class="controls" style="width: 350px;border: 0px solid red;vertical-align: middle;" >
<input type="text" name="businessName" maxlength="20" id="businessName" width="200px;"/>
<input type="text" name="userId" maxlength="20" value="<%=userId%>" id="userId" width="200px;"/>
<div id="businessName_error" ></div>
</div>

复制代码 代码如下:

</div>
<div class="control-group">
<label class="control-label">*商圈logo:</label>
<div class="controls" style="width:350px;">
<input type="file" name="file" id="file">
<div id="file_error"></div>
</div>
</div>
<div class="control-group">
<label class="control-label">*商圈英文名:</label>
<div class="controls" style="width: 350px;">
<input type="text" name="businessEname" id="businessEname" />
<div id="businessEname_error"></div>
</div>
</div>
<div class="form-actions">
<button type="button" id="imgSave" value="Validate" class="btn btn-primary">提交注册</button>
</div>
</form>
</div>
</div>
</div>
<div class="span1"></div>
</div>
</div>
<div class="container" style="background:white;">
<div class="row">
<div class="span12" style="margin-left: 25%;">
<p>© 2012 fingerknow.com <span>|</span><a href="#" rel="nofollow" >隐私条款</a><span>|</span><a href="#" rel="nofollow">服务条款</a><span>|</span><a href="#" rel="nofollow" >粤ICP备12003619号-1</a></p>
</div>
</div>
</div>
<script src="${ctx}/js/jquery-1.9.0.js"></script>
<script src="${ctx}/js/jquery.form.js"></script>
<script type="text/javascript">
/**
*
* V1.0
*/
$(document).ready(function() {

var options = {
url: "${ctx}/upload/upload.do",
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function(data) {
// 'data' is an object representing the the evaluated json data
// 如果图片上传成功则保存表单注册数据
if(data.status=="0"){
var fileName=data.fileName;
//alert(fileName);
var businessName=$("#businessName").val();
var userId=$("#userId").val();
var businessEname=$("#businessEname").val();
businessName=encodeURI(businessName);
businessName=encodeURI(businessName);
var urls="${ctx}/business/addBusiness.do?businessName=" businessName "&businessPic=" fileName "&businessEname=" businessEname "&userId=" userId;
$.ajax({
type: "post",
url:urls ,
dataType: "json", /*这句可用可不用,没有影响*/
contentType: "application/json; charset=utf-8",
success: function (data) {
if(data.status=="0"){
alert("注册成功!");
}else{
alert("注册失败!原因是:" data.message);
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}else{
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" data.message);
}
}
};
// 提交表单
$('#uploadImgForm').ajaxSubmit(options);
9159.com,});
});
</script>
</body>
</html>

复制代码 代码如下:

});
//验证商圈英文名
$("#businessEname").blur(function(){
var businessEname=$("#businessEname").val();
if(businessEname!=""){
$("#businessEname_error").html("<img src='${ctx}/images/success_img.gif' style='width:15px;height:15px;'/>");
}else{
$("#businessEname_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "商圈英文名不能为空!");
}
});
//图片上传 及数据保存
$("#imgSave").click(function(){
var ext = '.jpg.jpeg.gif.bmp.png.';
var f=$("#file").val();
if (f== "") {//先判断是否已选择了文件
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "请添加商圈logo!");
return false;
}
f = f.substr(f.lastIndexOf('.') 1).toLowerCase();
if (ext.indexOf('.' f '.') == -1) {
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "图片格式不正确!");
return false;
}

复制代码 代码如下:

function getdigshtml()'输出html
dim rsajax,sql,str,digsnum,undigsnum,digsnumall,digsper,undigsper
Set rsajax=server.CreateObject("adodb.recordset")
sql="select * from dig where id=1"
rsajax.open sql,conn,1,1
digsnum=rsajax("digs")
undigsnum=rsajax("undigs")
if isnull(digsnum) then digsnum=0
if isnull(undigsnum) then undigsnum=0
digsnumdigsnumall=digsnum undigsnum
if digsnumall=0 then
digsper=0
undigsper=0
else
digsper=FormatNumber(cint(digsnum)/cint(digsnumall),3)*100
undigsper=FormatNumber(cint(undigsnum)/cint(digsnumall),3)*100
end if
str="<div class='good'>"
strstr=str&"<a href=JavaScript:isdigs('digs') >"
strstr=str&"<p>这个文档不错</p><div class='bar'><div id='g_img' style='width:"&digsper&"%'></div></div>"
strstr=str&"<span class='num'>"&digsper&"%("&digsnum&")</span>"
strstr=str&"</a></div><div class='bad'>"
strstr=str&"<a href=JavaScript:isdigs('undigs') >"
strstr=str&"<p>文档有待改进</p><div class='bar'><div id='b_img' style='width:"&undigsper&"%'></div></div>"
strstr=str&"<span class='num'>"&undigsper&"%("&undigsnum&")</span>"
strstr=str&"</a></div>"
getdigshtml=str
end function

复制代码 代码如下:

//验证商圈名
$("#businessName").blur(function(){
var businessName=$("#businessName").val();
if(businessName!=""){
$("#businessName_error").html("<img src='${ctx}/images/success_img.gif' style='width:15px;height:15px;'/>");
}else{
$("#businessName_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "商圈名不能为空!");
}

输出完了,接下来一步就是digs和undigs的操作了,跟获取html的代码差不多

您可能感兴趣的文章:

  • jQuery插件ajaxFileUpload异步上传文件
  • jquery之ajaxfileupload异步上传插件(附工程代码)
  • ajax图片上传,图片异步上传,更新实例
  • php ajax实现异步上传文件或图片功能
  • jQuery插件ajaxFileUpload实现异步上传文件效果
  • asp.net ajaxfileupload.js 实现文件异步上传代码分享
  • JQuery插件ajaxfileupload.js异步上传文件实例
  • 解析ajaxFileUpload 异步上传文件简单使用
  • Ajax异步上传文件实例代码分享
  • ASP.NET中MVC使用AJAX调用JsonResult方法并返回自定义错误信息
  • ajax实现文件异步上传并回显文件相关信息功能示例

复制代码 代码如下:

<div class="digg" id="digg">
<div class="good"> <a href="#">
<p>这个文档不错</p>
<div class="bar">
<div id="g_img" style="width:70%"></div>
</div>
<span class="num" id="num">70%(7000)</span> </a> </div>
<div class="bad"> <a href="#">
<p>文档有待改进</p>
<div class="bar">
<div id="b_img" style="width:30%"></div>
</div>
<span class="num">30%(3000)</span> </a> </div>
</div>

(jsp需要引入 :jquery-1.9.0.js、jquery.form.js ) ,jsp页面使用的是bootstrap制作的,看不懂的标签不用管,form表单大同小异。代码比较简陋,只是为了演示使用ajaxSubmit异步上传图片及保存数据,请海含!
(参考文献://www.jb51.net/shouce/jquery/jquery_api/Plugins/Form/ajaxSubmit.html)
一:web (add.jsp)

二:service(FileUploadController.java ----springMVC 之controller层)

function getdigshtml()//获取顶一下,踩一下html
{
$.ajax({
type:'POST',
url:'digg.asp',
data:'action=getdigshtml',
success:function(msg){
$("#digg").html(msg);
}
})
}

<div class="widget-content nopadding">
<form class="form-horizontal" method="post" action="${ctx}/upload/upload.do" id="uploadImgForm" enctype="multipart/form-data">
<div class="control-group" style="border: 0px solid red;">
<label class="control-label">*商圈名:</label>
<div class="controls" style="width: 350px;border: 0px solid red;vertical-align: middle;" >
<input type="text" name="businessName" maxlength="20" id="businessName" width="200px;"/>
<input type="text" name="userId" maxlength="20" value="<%=userId%>" id="userId" width="200px;"/>
<div id="businessName_error" ></div>
</div>

});
//验证商圈英文名
$("#businessEname").blur(function(){
var businessEname=$("#businessEname").val();
if(businessEname!=""){
$("#businessEname_error").html("<img src='${ctx}/images/success_img.gif' style='width:15px;height:15px;'/>");
}else{
$("#businessEname_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "商圈英文名不能为空!");
}
});
//图片上传 及数据保存
$("#imgSave").click(function(){
var ext = '.jpg.jpeg.gif.bmp.png.';
var f=$("#file").val();
if (f== "") {//先判断是否已选择了文件
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "请添加商圈logo!");
return false;
}
f = f.substr(f.lastIndexOf('.') 1).toLowerCase();
if (ext.indexOf('.' f '.') == -1) {
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "图片格式不正确!");
return false;
}

输出完了 接下来就是前台获取,这时候我们就要用到jquery ajax,为什么不直接用ajax,原因很简单,我不会。。。。。看一下jquery中ajax代码,很简单

二:service(FileUploadController.java ----springMVC 之controller层)

:jquery-1.9.0.js、jquery.form.js ) ,jsp页面使用的是bootstrap制作的,看不懂的标签不用管,form表单大同小异。代码比较简陋,只是为...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ";
<html xmlns=";
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Digg</title>
<style type="text/css">
* {
padding:0;
margin:0;
}
.digg {
height: auto;
width: 190px;
font-size:12px;
font-weight:normal;
}
.digg a {
display: block;
height: 48px;
width: 189px;
background-image: url(images/mark.gif);
background-repeat: no-repeat;
position: relative;
color: #000;
text-decoration: none;
}
.digg .good {
margin-bottom:10px;
margin-top:5px;
}
.digg .good a {
background-position: -189px 0px;
}
.digg .good a:hover {
background-position: 0px 0px;
}
.digg .bad a {
background-position: -378px 0px;
}
.digg .bad a:hover {
background-position: -567px 0px;
}
.digg a p {
padding-left:30px;
line-height:25px;
}
.digg .bar {
background-color: white;
height: 5px;
left: 20px;
overflow: hidden;
position: absolute;
text-align: left;
top: 30px;
width: 55px;
}
.bar #g_img {
background-image: url(images/sprites.gif);
background-repeat: repeat-x;
height: 5px;
width: auto;
}
.bar #b_img {
background-image: url(images/sprites.gif);
background-repeat: repeat-x;
height: 5px;
width: auto;
background-position: 0px -5px;
}
.num {
color: #333;
font: normal normal 100 10px/12px Tahoma;
left: 80px;
position: absolute;
top: 26px;
}
.digg .good .bar {
border: 1px solid #40A300;
}
.digg .bad .bar {
border: 1px solid #555;
}
</style>
</head>
<body>
<div class="digg" id="digg">
<div class="good"> <a href="#">
<p>这个文档不错</p>
<div class="bar">
<div id="g_img" style="width:70%"></div>
</div>
<span class="num" id="num">70%(7000)</span> </a> </div>
<div class="bad"> <a href="#">
<p>文档有待改进</p>
<div class="bar">
<div id="b_img" style="width:30%"></div>
</div>
<span class="num">30%(3000)</span> </a> </div>
</div>
</body>
</html>

var options = {
url: "${ctx}/upload/upload.do",
dataType: 'json',
contentType: "application/json; charset=utf-8",
success: function(data) {
// 'data' is an object representing the the evaluated json data
// 如果图片上传成功则保存表单注册数据
if(data.status=="0"){
var fileName=data.fileName;
//alert(fileName);
var businessName=$("#businessName").val();
var userId=$("#userId").val();
var businessEname=$("#businessEname").val();
businessName=encodeURI(businessName);
businessName=encodeURI(businessName);
var urls="${ctx}/business/addBusiness.do?businessName=" businessName "&businessPic=" fileName "&businessEname=" businessEname "&userId=" userId;
$.ajax({
type: "post",
url:urls ,
dataType: "json", /*这句可用可不用,没有影响*/
contentType: "application/json; charset=utf-8",
success: function (data) {
if(data.status=="0"){
alert("注册成功!");
}else{
alert("注册失败!原因是:" data.message);
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(errorThrown);
}
});
}else{
$("#file_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" data.message);
}
}
};
// 提交表单
$('#uploadImgForm').ajaxSubmit(options);
});
});
</script>
</body>
</html>

<%@page import="com.fingerknow.project.vo.UserInformation"%>
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%@ taglib uri="" prefix="c" %>
<c:set var="ctx" value="${pageContext.request.contextPath }" />
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ";
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>注册商圈</title>
<link href="${ctx}/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="${ctx}/bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<link rel="stylesheet" href="${ctx}/css/bootstrap-responsive.min.css" />
<link rel="stylesheet" href="${ctx}/css/jquery-ui.css" />
<link rel="stylesheet" href="${ctx}/css/uniform.css" />
<link rel="stylesheet" href="${ctx}/css/select2.css" />
<link rel="stylesheet" href="${ctx}/css/unicorn.main.css" />
<link rel="stylesheet" href="${ctx}/css/common.css" />
<%
response.setCharacterEncoding("utf-8");//这个是设置编码方式
response.setContentType("text/html");//这个是设置网页类型,为文本代码
UserInformation user=null;
String username="";
Integer userId=null;
if(request.getSession().getAttribute("userinfo")!=null){
user=(UserInformation)request.getSession().getAttribute("userinfo");
username=user.getUsername();
userId=user.getUserId();
}else{
username="请<a href=';";
}
%>
</head>
<body>
<div class="header-inner">
<div class="container">
<div class="row">
<div class=" page-header clearfix">
<div class="span11"> <h1 class="page-header" style="background:black;"><img alt="fingerknow" src="${ctx}/images/fingerknow.png" width=""><small>中文最大的购物经验分享平台</small></h1> </div>
<div class="span1"> <a href="#">首页</a> |<a href="#">帮助</a></div>
</div>
</div>
</div>
</div>
<div class="container" id="businessEname_div">
<div class="row">
<div class="span1"></div>
<div class="span10">
<div class="widget-box">
<div class="widget-title">
<span class="icon">
<i class="icon-align-justify"></i>
</span>
<h5>注册商圈</h5>
</div>

复制代码 代码如下:

//验证商圈名
$("#businessName").blur(function(){
var businessName=$("#businessName").val();
if(businessName!=""){
$("#businessName_error").html("<img src='${ctx}/images/success_img.gif' style='width:15px;height:15px;'/>");
}else{
$("#businessName_error").attr("class","error_div").html("<img src='${ctx}/images/error_img2.gif' style='width:15px;height:15px;'/>" "商圈名不能为空!");
}

(jsp需要引入 :jquery-1.9.0.js、jquery.form.js ) ,jsp页面使用的是bootstrap制作的,看不懂的标签不用管,form表单大同小异。代码比较简陋,只是为了演示使用ajaxSubmit异步上传图片及保存数据,请海含!
(参考文献:)
一:web (add.jsp)

复制代码 代码如下:

主要一点就是通过百分比来控制g_img的宽度,至于css代码就不贴出来了。
演示代码:

有了demo,其他实现起来就方便多了,首先是页面获取html,页面第一次加载,用ajax获取后台数据,不要直接显示。(这里为了方便测试,就用asp作为后台语言)
下面是asp输出html代码

function isdigs(digtype)//顶一下,踩一下操作
{
$.ajax({
type:'POST',
url:'digg.asp',
data:'action=digs&digtype=' digtype,
/* beforeSend:function(){
$("#vote").hide();
$("#loadings").show();
}, ajax请求显示loading效果*/
success:function(msg){
switch (msg)
{
/* 后台用来判断
case '1':
$("#loadings").hide();
$("#vote").show();
alert("请先登录!");
break;
case '2':
$("#loadings").hide();
$("#vote").show();
alert("请先下载,再操作!");
break;
case '4':
$("#loadings").hide();
$("#vote").show();
alert("您已经参与过评价!");
break;*/
case '3':
getdigshtml();//重新绑定html
//$("#loadings").hide();
//$("#vote").show();
alert("谢谢你的参与!");
break;
default:
}
}
})
}

demo页面的实现

本文由9159.com发布于前端,转载请注明出处:只是为了演示使用ajaxSubmit异步上传图片及保存数

关键词: 9159.com