jquery uploadify无刷新上传图片,带案例

【实例截图】

【核心代码】

<form method="post" action="save.php" id="material_form">
<input name="Action" value="Add" type="hidden">
        <div class="m_lefter one">
          <div class="title">消息标题</div>
          <div><?=date("Y-m-d", time())?></div>
          <div class="img" id="ImgDetail">封面图片</div>
          <div class="txt"></div>
        </div>
        <div class="m_righter">
          <div class="mod_form">
            <div class="jt"><img src="images/jt.gif" /></div>
            <div class="m_form"> <span class="fc_red">*</span> 标题<br />
              <div class="input">
                <input name="title" value="" type="text" />
              </div>
              <div class="blank20"></div>
              <span class="fc_red">*</span> 封面图片 <span class="tips">大图尺寸建议：640*360px</span><br />
              <div class="blank6"></div>
              <div>
                <input id="ImgUpload" name="ImgUpload" type="file">
                <input type="hidden" id="ImgPath" name="thumb_url" value="" />
              </div>
              <div class="blank12"></div>
              简短介绍<br />
              <div>
                <textarea name="content"></textarea>
              </div>
              <div class="blank20"></div>
              <span class="fc_red">*</span> 链接页面<br />
              <div class="input">
               <select name='url'>
                <option value=''>--请选择--</option>
<optgroup label='---------------系统业务模块---------------'></optgroup>
                <option value="/member/">会员中心</option>
                <option value="/wap/">微官网</option>
<optgroup label="------------------自定义URL------------------"></optgroup>
<option value="#">一元夺</option>
               </select>
              </div>
            </div>
          </div>
        </div>
        <div class="clear"></div>
        <div class="button">
          <input type="submit" class="btn_green" name="submit_button" value="提交保存" />
          <a href="index.php" class="btn_gray">返回</a></div>
      </form>
<script language="javascript">
<!--
$(function() {
var queueSizeLimit=5;//上传队列中一次可容纳的最大条数
var fileTypeExts='*.gif; *.jpg; *.jpeg; *.png';//定义允许上传的文件后缀
var fileSizeLimit='2000KB';//上传文件大小限制。
   $('#ImgUpload').uploadify({
'formData'     : {
'timestamp' : '<?php echo $timestamp;?>',
'token'     : '<?php echo md5('unique_salt' . $timestamp);?>'
},
'swf'      : '/uploadify/uploadify.swf',
'uploader' : '/uploadify/uploadify.php',
'buttonImage' : '/uploadify/browse-btn.png',
'queueSizeLimit' : queueSizeLimit,
'multi'    : "false",
'fileTypeExts' : fileTypeExts,
'fileSizeLimit' : fileSizeLimit,
'onUploadSuccess' : function(file, data, response) {//每一个文件上传成功时触发该事件
if(response){
$("#ImgPath").val(data);
$("#ImgDetail").html('<img src="' data '" >');
}
}
 });
});
$('#material_form input[name=title]').on('keyup paste blur', function(){
$('#material_form .title').html($(this).val());
});
$('#material_form textarea').on('keyup paste blur', function(){
$('#material_form .txt').html($(this).val().replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1<br>$2'));
});
-->
</script>