close

上傳圖片的方式有很多，這個是用比較順的，至少還寫的很詳細又可以偷懶幹他的API用

網站位置 http://hayageek.com/docs/jquery-upload-file.php



上面是圖片 要的去官網有提供連結 :D

需要先放入這三個，阿第二個是JQ啦，如果自己本身有就不用丟免得衝突

這邊筆記可預覽上傳圖片的CODE

$("#previewupload").uploadFile({
                        url:"savelist.php",  //SERVER端，官網有提供
                        dragDrop: true,  //可否拖拉圖片上傳 預設是FALSE
                        fileName: "myfile", //檔名，若想更動建議到上傳的API那隻PHP去更動
                        returnType: "json", //回傳JSON格式
                        showDelete: true,  //是否顯示刪除鈕 預設FALSE
                        acceptFiles:"image/*",  
                        showPreview:true,  //能否預覽上傳圖片 預設FALSE
                        statusBarWidth:350, //狀態欄寬 用於顯示上傳的圖片名稱+檔案大小
                        dragdropWidth:350, //拖拉的寬度
                        maxFileCount:1,  //可同時上傳檔案數
                        allowedTypes:"jpg,png,gif",  //限制上傳的格式
                        previewHeight: "150px",  //預覽圖片高度
                        previewWidth: "150px",  //預覽圖片寬度
                         maxFileSize:950*300,  //限制上傳檔案大小
                        deleteCallback: function (data, pd) {
                            for (var i = 0; i < data.length; i++) {
                                    $.post("delpic.php", {op: "delete",name: data[i]},   //利用AJAX CALL 刪除的API 將檔名與OP送過去可處理
                                                function (resp,textStatus, jqXHR) {
                                                                //Show Message 
                                                                alert("圖片已刪除");
                                                              });
                                                                  }
                                                                      pd.statusbar.hide(); //You choice.
                                                                    },
                                                                    onSuccess:function(files,data,xhr,pd)
                                                                    {
                                                                        //files: list of files
                                                                            $("#file_name").val(data);   //這邊單純是紀錄檔名使用
                                                                                //xhr : jquer xhr object
                                                                              }
                                                                            }); 
                                                                             });

這樣就可以使用上傳圖片，如果想要修改顯示的文字，就需要自己到jquery.uploadfile.min.js裡面修改了，

如果要改成中文記得要加UTF8免得變成亂瑪

arrow
arrow
    文章標籤
    jquery javascript
    全站熱搜

    willis0623 發表在 痞客邦 留言(0) 人氣()

    E-mail轉寄