zoukankan      html  css  js  c++  java
  • bs同时上传文件以及文件信息

    上传图片和图片信息时直接在前端将他们放在同一个json 然后异步上传即可:

    前端html:

    <form id="ff" action="" method="post">
    <table>
    <tr>
    <td>名称:</td>
    <td>
    <input class="easyui-validatebox" type="text" name="name" data-options="required:true"></input></td>
    </tr>
    <tr>
    <td>邮箱:</td>
    <td>
    <input class="easyui-validatebox" type="text" name="email" data-options="required:true,validType:'email'"></input></td>
    </tr>
    <tr>
    <td>标题:</td>
    <td>
    <input class="easyui-validatebox" type="text" name="subject" data-options="required:true"></input></td>
    </tr>
    <tr>
    <td>内容:</td>
    <td>
    <textarea name="message" style="height: 60px;"></textarea></td>
    </tr>
    <tr>
    <td>语言:</td>
    <td>
    <select class="easyui-combobox" name="language">
    <option value="ar">Arabic</option>
    <option value="bg">Bulgarian</option>
    </select>
    </td>
    </tr>
    <tr>
    <td>图片:</td>
    <td>
    <input id="ffp" type="file" onclick="showMyImage(this)" multiple="1" />
    <br />
    <img id="thumbnil" style="20%; margin-top:10px;" src="" alt="image" />
    </td>
    </tr>
    </table>
    </form>
    View Code

    前端js:

         function uploadfiles() {
    
           var formData = new FormData();
           //获取文件
            var totalFiles = document.getElementById("ffp").files.length;
            for (var i = 0; i < totalFiles; i++) {
                var file = document.getElementById("ffp").files[i];
                formData.append("FileUpload", file);
            }
           //获取文件外的参数
            params = $('#ff').serializeArray();
            $.each(params, function (i, val) {
                formData.append(val.name, val.value);
            });
           //异步上传
            $.ajax({
                type: "POST",
                url: '/Home/Upload',
                data: formData,
                dataType: 'json',
                contentType: false,
                processData: false,
                success: function (response) {
                    alert('succes!!');
                },
                error: function (error) {
                    alert("errror");
                }
            });
        }
    View Code

    后台代码(这里是ASP .NET MVC ):

       [HttpPost]
            public JsonResult Upload(FormCollection collection)
            {
                //保存文件
                for (int i = 0; i < Request.Files.Count; i++)
                {
                    HttpPostedFileBase file = Request.Files[i]; //Uploaded file
                                                                //Use the following properties to get file's name, size and MIMEType
                    int fileSize = file.ContentLength;
                    string fileName = file.FileName;
                    string mimeType = file.ContentType;
                    System.IO.Stream fileContent = file.InputStream;
                    //To save file, use SaveAs method
                    file.SaveAs(Server.MapPath("~/") + fileName); //File will be saved in application root
                }
                //获取文件信息(两种方法)
                string var1 = collection["name"];
                var value1 = Request["name"];
                return Json("Uploaded " + Request.Files.Count + " files");
            }
    View Code
  • 相关阅读:
    2.monkey的使用
    1.monkey的安装及环境配置
    3.SQL注入系列二
    2.SQL注入系列一
    1.Appscan工具的使用
    二十二.jmeter的架构和loadrunner原理一样,都是通过中间代理,监控和收集并发客户端发出的指令,把他们生成脚本,再发送到应用服务器,再监控服务器反馈结果
    二十一.HTTP属性管理
    二十. StringFromFile与counter函数
    十九.jmeter函数---csvRead( )
    十八.jmete java工程测试
  • 原文地址:https://www.cnblogs.com/musexiaoluo/p/6065630.html
Copyright © 2011-2022 走看看