<!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" lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-cn" />
<title>demo</title>
<style type="text/css">
h2 {background-color: #FFE097; margin-top: 0;}
#upload_block {border: 5px solid #FFB300; height: 230px;}
.JSGImgPreview {float: left; background: url() no-repeat center 50% #FFFAD9; width: 160px; height: 120px; border: solid 1px #0080FF; margin: 0 5px;}
</style>
</head>

<body>
<div id="upload_block">
  <h2>图档上传测试区,可上传 3 张图</h2>
  <div id="preview_block"></div>
  <div style="clear: both;">
    <span id="image_input_block"></span>
  </div>
</div>
<hr />
窗体在 Submit 前可使用:<br/>
1. isReady() 判断是否仍在传档 <br/>
2. getFiles() 取得已上传的档名 <br/>
<input type="button" id="isReady" value="isReady" /><span id="resultIsReady"></span><br/>
<input type="button" id="getFiles" value="getFiles" /><span id="resultGetFiles"></span>
<script type="text/javascript" src="/js/jquery-1.2.6.pack.js"></script>
<script type="text/javascript" src="/js/jquery.form.js"></script>
<script type="text/javascript" src="JSG.ImageUploader.js"></script>
<script type="text/javascript">
$(function() {
  myImageUploader1 = new JSG.imgUploader({fileLimits: 3, actionUrl: 'demo_upload.php', inputContainer: 'image_input_block', previewContainer: 'preview_block'});

  $('#isReady').click(function() {
    $('#resultIsReady').html(myImageUploader1.isReady().toString());
  });

  $('#getFiles').click(function() {
    $('#resultGetFiles').html(myImageUploader1.getFiles());
  });
});
</script>
</body>

</html>

 posted on 2008-09-05 13:10  刘卿  阅读(294)  评论(0编辑  收藏  举报