jquery異步上傳組件SmartUpload

 

源碼:

 

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
  2. <html> 
  3. <head> 
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
  5. <title>SmartUpload</title> 
  6. <link rel="stylesheet" href="reset.css"></link> 
  7. <link rel="stylesheet" href="demo.css"></link> 
  8. <style> 
  9. @media screen and (-webkit-min-device-pixel-ratio:0){ .ks-smartupload-file {margin-left:-370px;} }  /*chrome and safari*/ 
  10. </style> 
  11. </head> 
  12. <body> 
  13. <h1>SmartUpload(Default)</h1> 
  14. <div>默認模式</div> 
  15. <div class="wrapper"><a href='#' id="J_btn" class='J_btn'>上傳</a></div> 
  16. <script type="text/javascript" src="jquery-latest.min.js"></script> 
  17. <script type="text/javascript" src="smartupload.js"></script> 
  18. <script type="text/javascript"> 
  19. (function($){ 
  20. /** 
  21.  * $.fn.SmartUpload(target,cfg)  
  22.  * @param target 上傳按鈕  
  23.  * @param cfg 配置項 
  24.  * 
  25.  */ var title = ""
  26.      
  27.         var su = new $.fn.SmartUpload("#J_btn",{ 
  28.             //上傳類型 
  29.             type:"iframe", 
  30.             //上傳路徑 
  31.             url:"upload.php", 
  32.             //返回類型 
  33.             //dataType:"json", 
  34.             fileName:"fileData", 
  35.             //回調 
  36.             success:function(data){ 
  37.                 //callback 
  38.                 alert(data); 
  39.                  
  40.             } 
  41.              
  42.         }); 
  43.  
  44.         $("#J_submit").click(function(){ 
  45.             //可以傳輸動態獲取的數據至服務器 
  46.             su.setData({"sendData":$("#J_param_text").val()}); 
  47.              
  48.             su.submit(); 
  49.              
  50.         }); 
  51.          
  52. })(jQuery); 
  53. </script> 
  54. </body> 
  55. </html> 
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章