时间:2016-02-15 22:17 来源: 我爱IT技术网 作者:佚名
欢迎您访问我爱IT技术网，今天小编为你分享的编程技术是：【swfupload ajax无刷新上传图片实例代码】，下面是详细的讲解！
swfupload ajax无刷新上传图片实例代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ChangeAvatar.aspx.cs" Inherits="NovelChannel.ChangeAvatar" %>
<!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 runat="server">
<title></title>
<link href="http://www.jb51.net/CSS/jQueryUI/jquery-ui-1.10.2.custom.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#draggable
{
width:50px;
height:50px;
padding:0.5em;
}
</style>
<script src="http://www.jb51.net/JS/jQuery/jquery-1.9.1.js" type="text/javascript"></script>
<script src="http://www.jb51.net/JS/jQuery/jquery-ui-1.10.2.custom.js" type="text/javascript"></script>
<script type="text/javascript" src="http://www.jb51.net/JS/swf/swfupload.js"></script>
<script type="text/javascript" src="http://www.jb51.net/JS/swf/handlers.js"></script>
<script type="text/javascript">
function uploadImgSuccess(file, response) {
//$("#imgAvatar").attr("src", response + "?ts=" + new Date());
//"url("+response + "?ts="+ new Date()+")")
var strs=$.parseJSON(response);
var imgPath=strs[0];
var imgWidth=strs[1];
var imgHeight=strs[2];
$("#avatarContainer").css("background-image", "url(" + imgPath + ")");
$("#avatarContainer").css("width", imgWidth + "px").css("height", imgHeight+"px");
};
$(function () {
var swfu;
swfu=new SWFUpload({
// Backend Settings
upload_url: "/Ajax/UploadAvatar.ashx",
post_params: {
"ASPSESSID": "<%=Session.SessionID %>"
},
// File Upload Settings
file_size_limit: "2 MB",
file_types: "*.jpg",
file_types_description: "JPG Images",
file_upload_limit: 0, // Zero means unlimited
// Event Handler Settings - these functions as defined in Handlers.js
// The handlers are not part of SWFUpload but are part of my website and control how
// my website reacts to the SWFUpload events.
swfupload_preload_handler: preLoad,
swfupload_load_failed_handler: loadFailed,
file_queue_error_handler: fileQueueError,
file_dialog_complete_handler: fileDialogComplete,
upload_progress_handler: uploadProgress,
upload_error_handler: uploadError,
upload_success_handler: uploadImgSuccess,
upload_complete_handler: uploadComplete,
// Button settings
button_image_url: "/JS/swf/images/XPButtonNoText_160x22.png",
button_placeholder_id: "btnUploadImgPlaceholder",
button_width: 160,
button_height: 22,
button_text: '<span class="button">选择图片（最大2MB）</span>',
button_text_style: '.button { font-family: Helvetica, Arial, sans-serif; font-size: 14pt; } .buttonSmall { font-size: 10pt; }',
button_text_top_padding: 1,
button_text_left_padding: 5,
// Flash Settings
flash_url: "/JS/swf/swfupload.swf", // Relative to this file
flash9_url: "/JS/swf/swfupload_FP9.swf", // Relative to this file
custom_settings: {
upload_target: "divFileProgressContainer"
},
// Debug Settings
debug: false
});
});
$(function () {
$("#draggable").draggable({ containment: "parent" },
{ cursor: "crosshair" });
$("#draggable").dblclick(function () {
var thisOffset=$(this).offset();//获取改容器的坐标位置
var parentOffset=$(this).parent().offset(); //获取父容器的坐标位置
var left=thisOffset.left - parentOffset.left;//得到相对于父窗体的相对位置
var top=thisOffset.top - parentOffset.top; //得到相对于父窗体的相对位置
alert(left+" "+top);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<span id="btnUploadImgPlaceholder"></span>
<div id="divFileProgressContainer"></div>
<br />
<div id="avatarContainer" style="width:200px;height:300px">
<div id="draggable" style="background-color:transparent;border-width:1px;border-color:Black;border-style:solid;">
拖过
</div>
</div>
<img id="imgAvatar" style="display:none;"/>
</div>
</form>
</body>
</html>
关于swfupload ajax无刷新上传图片实例代码的用户互动如下：
相关问题：
答： >>详细
相关问题：
答： >>详细
相关问题：
答： >>详细
- 【asp】asp.net url重写浅谈-net-url重写
- 【DataSet】DataSet、DataTable、DataRow区别详解
- 【创建】ASP.NET Web API教程 创建域模型的方法详
- 【asp】asp.net ubb使用代码-net-ubb使用
- 【默认图片】图片不存在使用默认图片代替的实例
- 【asp】asp.net 页面转向 Response.Redirect Ser
- 【页面打印】关于ASP.NET页面打印技术的常用方法
- 【MVC5】MVC 5 第一章 创建MVC 5 web应用程序-net
- 【MVC】一个简单MVC5 + EF6示例分享-EF6实例-MVC5
- 【服务器】asp.net页面状态管理cookie和服务器状
- 评论列表（网友评论仅供网友表达个人看法，并不表明本站同意其观点或证实其描述）
-