ajax实现无刷新上传图片

最新推荐文章于 2018-07-14 16:32:12 发布

jackin2

最新推荐文章于 2018-07-14 16:32:12 发布

阅读量4.1k

点赞数

文章标签： ajax string function input stream button

本文链接：https://blog.csdn.net/jackin2/article/details/5479468

版权

很多朋友问我如何实现无刷新上传图片,这里小黑给大家找了一篇关于无刷新实现图片上传的文章,希望对大家有帮助.

本文客服端使用的是ajax.net异步上传文件
1.在
    protected void Page_Load(object sender, EventArgs e)
    {
        Ajax.Utility.RegisterTypeForAjax(typeof(renzheng1));
    }
中注册类。
2.后台代码中的webservice
//filePath 本地文件路径
//ext 文件扩展名

//其实就是后台代码中的一个函数
[Ajax.AjaxMethod()]
    public string RenZhengCom(string filePath,string ext)
    {
        string str = "/UploadFile/renzheng/" + Pq168Help.GenerateFileName()+ext;

            string SaveUrl = Server.MapPath(str);//上传到什么位置
            WebClient myWebClient = new WebClient();//创建WebClient实例
            myWebClient.Credentials = CredentialCache.DefaultCredentials;//得到网络凭据
            FileStream fs = new FileStream(filePath, FileMode.Open, FileAccess.Read);
            BinaryReader r = new BinaryReader(fs);
            if (fs.Length / 1024 > 200)
            {
                return "你输入的图片大于200k！";
            }
            byte[] postArray = r.ReadBytes((int)fs.Length);
            Stream postStream = myWebClient.OpenWrite(SaveUrl, "PUT");
            postStream.Write(postArray, 0, postArray.Length);
            postStream.Close();
            return "上传成功！";
    }
3.js代码
   function saveimg(obj)
   {
       var img=document.getElementById('upfile');
       if(CheckImg(img.value.toLowerCase()))
       {
          obj.disabled="disabled";
          var tt=renzheng1.RenZhengCom(idzhi.value,img.value,getExt(img.value));
          obj.disabled="";
          alert(tt.value);
       }
       else
       {
           alert('请上传正确的图片！');
       }
   }

function CheckImg(str)
   {
        var strFilter=".jpeg|.gif|.jpg|.png|.bmp|.pic|"
        if(str.indexOf(".")>-1)
        {
            var p = str.lastIndexOf(".");

            var strPostfix=str.substring(p,str.length) + '|';
            strPostfix = strPostfix.toLowerCase();

            if(strFilter.indexOf(strPostfix)>-1)
            {

                return true;
            }
        }

        return false;
   }
4.页面
<body >
<form id="form1" runat="server">
    <div>
    </div>
    <div>
上传营业执照：
                <input type="file" id="upfile" οnchange="showpic(this);" />*注意，文件小于200k，文件格式要求jpg、gif、png和bmp。
                <div><img alt="上传图片" width="180px" height="135px" id="ImageUrl"/></div>
                <input type="button" value="提交" οnclick="saveimg(this)" />
    </div></form>
</body>
5.其他
使用ajax.net，需要引用ajax.dll，并在web.config中设置
<httpHandlers>
      <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
</httpHandlers>

jackin2

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
ajax实现无刷新上传图片

很多朋友问我如何实现无刷新上传图片,这里小黑给大家找了一篇关于无刷新实现图片上传的文章,希望对大家有帮助.本文客服端使用的是ajax.net异步上传文件1.在 protected void Page_Load(object sender, EventArgs e) { Ajax.Utility.RegisterTypeForAjax(typeof(renzheng1)
复制链接

扫一扫