swfupload 上传文件 浏览器端 使用方法

2 篇文章 0 订阅
2 篇文章 0 订阅
</pre><p>HTML代码</p><p> <pre name="code" class="html"> <script src="@{'/public/javascripts/jquery-1.7.2.js'}" type="text/javascript" charset="${_response_encoding}"></script>      
 <script src="@{'/public/javascripts/jquery.swfupload.js'}" type="text/javascript" charset="${_response_encoding}"></script>
 <script src="@{'/public/javascripts/swfupload.js'}" type="text/javascript" charset="${_response_encoding}"></script>

<p style="margin:0;padding:0">
				<label style="display:inline-block; width:120px; margin:0;padding:0;">banner图片资源</label>
				<div class="image-upload image-upload-default swfupload-control">
					<div class="image" style="text-align: center;">点击上传图片480x75
						<input type="hidden" name="image" value="" class="image-upload-src" />
						<input type="hidden" class="upload-width" value="240" />
						<input type="hidden" class="upload-height" value="36" />
						<input class="swfupload-button" type="button" />
					</div>
				</div>
</p>


js初始化

/*
 * swfupload ======================
 */
browser.swfupload = function() {
	jQuery.fn.bindAll = function(options) {
		var $this = this;
		jQuery.each(options, function(key, val) {
			$this.bind(key, val);
		});
		return this;
	}
	var listeners = {
		fileQueued : function(event, file) {
			// start the upload once it is queued
			// but only if this queue is not disabled
			if(!$('input[name=disabled]:checked', this).length) {
				$(this).swfupload('startUpload');
			}
		},
		uploadStart : function(event, file) {
			// don't start the upload if this queue is disabled
			if($('input[name=disabled]:checked', this).length) {
				event.preventDefault();
			}
		},
		fileDialogComplete : function(event, numFilesSelected, numFilesQueued) {
			// OpenAds.log("File dialog complete");
		},
		fileQueueError : function(event, file, errorCode, message) {
			// OpenAds.log('appjietu_fileQueueError:' + errorCode);
		},
		uploadSuccess : function(event, file, serverData) {
			var d = jQuery.parseJSON(serverData);
			if(d['return'] == false) {
				// OpenAds.alert(d.message);
				return false;
			}
			if(d.fileKey) {
				console.log(d.fileKey);
				// $("img", this).attr('src',
				// d.url.replace(/^(.+)\.([a-zA-Z]+)$/, "$1_239.$2"));
				var url = "http://XXX/down/" + d.fileKey;
				$("img", this).remove();
				$(".image", this).append($("<img/>").attr({
					"src" : url,
					"width" : $(".upload-width", this).val(),
					"height" : $(".upload-height", this).val()
				}));

				$("input.image-upload-src:hidden", this).val(url);
			}
		},
		uploadComplete : function(event, file) {
			// upload has completed, lets try the next one in the queue
			// but only if this queue is not disabled
			if(!$("input[name=disabled]:checked", this).length) {
				$(this).swfupload('startUpload');
			}
		},
		uploadError : function(event, file, errorCode, message) {
			// OpenAds.log('appjietu_uploadError:' + errorCode);
		}
	};

	$('.swfupload-control').bindAll(listeners);

	// start the queue if the queue is already disabled
	$('.swfupload-control input[name=disabled]').click(function() {
		if(!this.checked) {
			$(this).parents('.swfupload-control').swfupload('startUpload');
		}
	});

	$('.swfupload-control').each(function() {
		var $this = $(this);
		var iImageWidth = $(".upload-width", $this).val() - 0;
		var iImageHeight = $(".upload-height", $this).val() - 0;
		$this.swfupload({
			upload_url : "http://f.XXXXXXXXX.com/upload?type=image&result=info",
			file_size_limit : "2048",
			file_types : "*.png",
			file_types_description : "png格式",
			file_upload_limit : "0",
			flash_url : "http://XXXXXXXX.XXXXXXXXX.com/android_browser_mng/res/js/swfupload-2.2/swfupload.swf",
			button_width : iImageWidth,
			button_height : iImageHeight,

			button_placeholder : $(".swfupload-button",
			this)[0],
			debug : false
		});
	});
};


  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值