uploadify 上传预览

<script type="text/javascript">
$(function() {
$("#file_upload_1")
.uploadify(
{
'buttonText' : '请选择12', //按钮显示的文字
height : 30,//按钮的高
width : 120,//按钮的长
swf : 'js/uploadify.swf',
uploader : 'uploadForm.html', //post请求的地址
'fileObjName' : 'file',//file对象的名字,相当于id="file"
'fileTypeExts' : '*.jpg; *.png; *.JPG ; *.PNG', //限定上传文件的类型
onUploadSuccess : function(file, data, response) {
var str = $('#divId').html();//.html()是用来读取元素的HTML内容(包括其Html标签),如果只想显示一张的话,就不需要写这个了
var add = "<img src='"
+ "${pageContext.request.contextPath}/upload/"
+ file.name
+ "'"
+ " style='margin-left:15px;margin-top:15px' onclick='open1(this)'/></img>";
str += add;//把上次上传的html内容和这次的拼接在一起,也就是说把所有上传的图片都显示出来,如果只想显示一张的话,就不需要写这个了
$('#divId').html(str);//设置HTML内容
}
});
});
function open1(obj) {
// 点击图片,另开一个窗口察看
window.open($(obj).attr("src"), "_blank");
}
</script>
</head>
<body>
<div id="fileQueue"></div>
<input type="text" id="name1" name="name1" />
<input type="file" name="file_upload_1" id="file_upload_1"
class="uploadify" />
<div id="divId"></div>
</body>

posted @ 2014-11-14 15:49  口我  阅读(121)  评论(0编辑  收藏  举报