多圖上傳 - Web Uploader

http://fex.baidu.com/webuploader/

 

官方DEMO，我都不想說了，各類問題。參考ShuaiBi文章

 

http://www.cnblogs.com/ismars/p/4176912.html

 

用了bootstrap 代碼百度網盤地址：http://pan.baidu.com/s/1pJkj9wf

本身參照改改就行了。

 

 

            //全部文件上傳完畢
            uploader.on("uploadAccept", function (file, response) {
                //console.info(file)
                //console.info(response.filePath)

                //----給頭像賦值----
                $("#EditForm input[name='Header_Ico']").val("http://" + window.location.host + response.filePath);
                //提交表單
                //if (hasError) {
                //    // 經過return false來告訴組件，此文件上傳有錯。
                //    return false;
                //}
            });

 

爲了頁面不刷新，我只有採用這個手段了，JS渣的說。

            //開始上傳
            $("#ctlBtn").click(function () {
                console.info(uploader)
                uploader.upload();
                return false;//頁面不刷新
            });

 

 

問題1：

 

$(…).live("mouseout", function ()  not a function

<script src="~/Scripts/jquery.min.js"></script>

改成

<script src="~/Scripts/jquery-1.8.2.js"></script>

 

 

問題2：

上傳3張圖片，組成格式

中間以「,」隔開

p://localhost:28278/Upload/4039280d9d604a7dbdf85f3282d509a7.png,http://localhost:28278/Upload/120a5587e8bc43449c5ca13142145b05.png

代碼：

// 文件上傳成功，給item添加成功class, 用樣式標記上傳成功。
            uploader.on('uploadSuccess', function (file, response) {
                console.info(uploader.getStats())
                var temp = "http://" + window.location.host + response.filePath;
                //判斷uploader.getStats().successNum狀態（在uploadSuccess）
                if (uploader.getStats().successNum == 1) {
                    //console.info(0)
                    $("#EditForm input[name='photourl']").val(temp);
                } else {
                    //console.info(1)
                    $("#EditForm input[name='photourl']").val($("#EditForm input[name='photourl']").val() + "," + temp);
                }

                $('#' + file.id).addClass('upload-state-done');
            });