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

    1、图片类型的过滤

     1 //过滤类型
     2     function fileType(obj){
     3         var fileType=obj.value.substr(obj.value.lastIndexOf(".")).toLowerCase();//获得文件后缀名
     4         if(fileType != '.gif' && fileType != '.png' && fileType != '.jpg' && fileType != '.jpeg'){
     5             $("#tp").tips({
     6                 side:3,
     7                 msg:'请上传图片格式的文件',
     8                 bg:'#AE81FF',
     9                 time:3
    10             });
    11             $("#tp").val('');
    12             document.getElementById("tp").files[0] = '请选择图片';
    13         }
    14     }
    15     

    2、图片的删除

    //删除图片
        function delP(PATH,PICTURES_ID){
             if(confirm("确定要删除图片?")){
                var url = "pictures/deltp.do?PATH="+PATH+"&PICTURES_ID="+PICTURES_ID+"&guid="+new Date().getTime();
                $.get(url,function(data){
                    if(data=="success"){
                        alert("删除成功!");
                        document.location.reload();
                    }
                });
            } 
        }

     3、图片上传的预览

    1 var file = this.files[0]; // 选择上传的文件
    2         var r = new FileReader();
    3         r.readAsDataURL(file); // Base64
    4         $(r).load(function() {
    5             $('.shop_img').html('<img src="' + this.result + '" alt="" /><a class="photo_add">修改</a>');
    6         });

     4、H5的上传组件

     1 //保存文件
     2         var fileObj = document.getElementById("PHOTO").files[0]; // 获取文件对象
     3         var FileController = "organization/webMarkertEdit"; //获取路劲
     4          // FormData 对象
     5         var form = new FormData();
     6         //判断是否上传了图片
     7         form.append("PHOTO", fileObj);                    // 文件对象
     8         form.append("MARKETER_ID",$("#MARKETER_ID").val());
     9         form.append("MOBILE",$("#MOBILE").val());
    10         form.append("ADDRESS",$("#ADDRESS").val());
    11         form.append("BEFORE_PHOTO",$("#BEFORE_PHOTO").val());
    12         // XMLHttpRequest 对象
    13         var xhr = new XMLHttpRequest();
    14         //设置回调函数    
    15         xhr.onreadystatechange = zswFun;
    16         xhr.open("post", FileController, false);
    17         xhr.onload = function (data) {
    18             console.log("上传完成!");
    19         };
    20         xhr.send(form);
    21         
    22         function zswFun(){
    23             if(xhr.readyState == 4 && xhr.status == 200){
    24                 swal({title:"修改成功!",text:'',type:"success"},function(){
    25                     window.location.href="webPage/mystore?MARKETER_ID="+$("#MARKETER_ID").val();
    26                 });
    27             }
    28         }
  • 相关阅读:
    使用JavaScriptSerializer进行JSON序列化
    清除浮动
    后台请求url数据
    设置Response中的ContentType
    javascript阻止事件冒泡
    如何启动Nunit的调试功能
    AjaxControlToolKit(整理)二···(全部源代码)
    DataRow对象数据绑定问题
    修改程序之感悟
    关于虚函数一个很好的解释
  • 原文地址:https://www.cnblogs.com/xyt-0412/p/4800514.html
Copyright © 2011-2022 走看看