zoukankan      html  css  js  c++  java
  • 上传图片

    一 页面结构

           <input type="file" name="image"  value=" "  accept="image/*"  multiple />

            name : 设置保存图片的属性名

            value : 保存的图片

            multiple: 设置这个属性可以选择多个图片

    二  js代码

            1  上传服务器代码        

            

             var formData = new FormData($('#sumbit-up')[0]);   //序列化表单
             //  var data =$('#sumbit-up').serialize();      //序列化数据,但不能序列化文件
             $.ajax({
                        type: 'post',
                        url: __domain__ + 'api/merge/singeapi/type/userComment', 
                        //    data:data,   
                        data: formData,
                        processData: false, 
                        contentType: false,
                        success: function(data) {
                                   alert(JSON.stringify(data));
                         },
                         error: function(XMLHttpRequest, textStatus, errorThrown) {
                                   alert("上传失败,请检查网络后重试");
                          }
                        });

             2 详细介绍

                     FormData和serialize   都是序列化表单,区别在与:后者只能序列化表单数据,比如select,比如文本框等input  select等的数据,

                     但是对于文件,比如文件上传,无法实现,那么这时候,FormData就上场了。

                     processData和contentType   缺少这二者的设置,将会出现  红色部分的错误提示,提交失败。

                 

             

  • 相关阅读:
    svn中trunk、branches、tags
    支付宝支付对接过程
    分享插件
    ES6学习笔记
    VS code
    Angular45
    React笔记
    查询Table name, Column name, 拼接执行sql文本, 游标, 存储过程, 临时表
    通过脚本把远程服务器上的表和数据拷贝到本地数据库
    mongo客户端mongo VUE增删改查
  • 原文地址:https://www.cnblogs.com/huancheng/p/7269110.html
Copyright © 2011-2022 走看看