Jquery Uploadify多文件上傳帶進(jìn)度條且傳遞自己的參數(shù)
更新時(shí)間:2013年08月28日 15:42:50 作者:
Jquery Uploadify多文件上傳帶進(jìn)度條且傳遞自己的參數(shù),具體實(shí)現(xiàn)如下,需要的朋友可以學(xué)習(xí)下
復(fù)制代碼 代碼如下:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="UpLoad.aspx.cs" Inherits="UploadifyDemo_UpLoad" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Jquery Uploadify上傳帶進(jìn)度條,且多參數(shù)</title>
<link href="js/jquery.uploadify-v2.1.4/uploadify.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="js/jquery.uploadify-v2.1.4/swfobject.js"></script>
<script type="text/javascript" src="js/jquery.uploadify-v2.1.4/jquery.uploadify.v2.1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#uploadify").uploadify({
'uploader': 'js/jquery.uploadify-v2.1.4/uploadify.swf', //uploadify.swf文件的路徑
'script': 'UploadHandler.ashx', //處理文件上傳的后臺(tái)腳本的路徑
'cancelImg': 'js/jquery.uploadify-v2.1.4/cancel.png',
'folder': 'UploadFile/<% = DateTime.Now.ToString("yyyyMMdd") %>', //上傳文件夾的路徑按20130416
'queueID': 'fileQueue', //頁(yè)面中,你想要用來作為文件隊(duì)列的元素的id
'auto': false, //當(dāng)文件被添加到隊(duì)列時(shí),自動(dòng)上傳
'multi': true, //設(shè)置為true將允許多文件上傳
'fileExt': '*.jpg;*.gif;*.png', //允許上傳的文件后綴
'fileDesc': 'Web Image Files (.JPG, .GIF, .PNG)', //在瀏覽窗口底部的文件類型下拉菜單中顯示的文本
'sizeLimit': 102400, //上傳文件的大小限制,單位為字節(jié) 100k
'onAllComplete': function (event, data) { //當(dāng)上傳隊(duì)列中的所有文件都完成上傳時(shí)觸發(fā)
alert(data.filesUploaded + ' 個(gè)文件上傳成功!');
}
});
});
function uploadpara() {
//自定義傳遞參數(shù)
$('#uploadify').uploadifySettings('scriptData', { 'name': $('#txtName').val(), 'albums': $('#txtAlbums').val() });
$('#uploadify').uploadifyUpload();
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
用戶名:<asp:TextBox ID="txtName" runat="server"></asp:TextBox><br/>
相冊(cè)名:<asp:TextBox ID="txtAlbums" runat="server"></asp:TextBox>
</div>
</form>
<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<a href="javascript:void(0);" onclick="uploadpara();">上傳</a>|
<a href="javascript:$('#uploadify').uploadifyClearQueue()">取消上傳</a>
</p>
</body>
</html>
復(fù)制代碼 代碼如下:
<%@ WebHandler Language="C#" Class="UploadHandler" %>
using System;
using System.Web;
using System.IO;
/// <summary>
/// UploadHandler文件上傳
/// </summary>
public class UploadHandler : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Charset = "utf-8";
HttpPostedFile file = context.Request.Files["Filedata"];
string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]);
string name = context.Request.Params["name"]; //獲取傳遞的參數(shù)
string albums = context.Request.Params["albums"];
if (file != null)
{
if (!Directory.Exists(uploadPath))
{
Directory.CreateDirectory(uploadPath);
}
file.SaveAs(Path.Combine(uploadPath, file.FileName));
context.Response.Write("1");
}
else
{
context.Response.Write("0");
}
}
public bool IsReusable
{
get
{
return false;
}
}
}
相關(guān)文章
jquery的ajaxSubmit()異步上傳圖片并保存表單數(shù)據(jù)演示代碼
使用jquery的ajaxSubmit()異步上傳圖片的捅死實(shí)現(xiàn)保存表單數(shù)據(jù),具體演示代碼如下,感興趣的朋友可以參考下哈,希望對(duì)大家有所幫助2013-06-06簡(jiǎn)單實(shí)現(xiàn)jQuery彈幕效果
這篇文章主要為大家詳細(xì)介紹了簡(jiǎn)單實(shí)現(xiàn)jQuery彈幕效果的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05jQuery 獲取屏幕高度、寬度的簡(jiǎn)單實(shí)現(xiàn)案例
下面小編就為大家?guī)硪黄猨Query 獲取屏幕高度、寬度的簡(jiǎn)單實(shí)現(xiàn)案例。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05Javascript中封裝window.open解決不兼容問題
window.open不兼容,其實(shí)不是, 因?yàn)椴荒苤苯訄?zhí)行, 必須通過用戶手動(dòng)觸發(fā)才行,下面有個(gè)實(shí)例,大家可以看看2014-09-09jquery實(shí)現(xiàn)加載進(jìn)度條提示效果
這篇文章主要介紹了jquery實(shí)現(xiàn)加載進(jìn)度條提示效果,感興趣的小伙伴們可以參考一下2015-11-1120款非常優(yōu)秀的 jQuery 工具提示插件 推薦
工具提示(Tooltip)在網(wǎng)站中的一個(gè)小功能,但卻有很重要的作用,常用于顯示一些溫馨的提示信息。如果網(wǎng)站中的工具提示功能做得非常有創(chuàng)意的話能夠加深用戶對(duì)網(wǎng)站印象2012-07-07Jquery實(shí)時(shí)監(jiān)聽input value的實(shí)例
下面小編就為大家?guī)硪黄狫query實(shí)時(shí)監(jiān)聽input value的實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-01-01