基于AdminLTE的jquery头像更新
2024-08-30 11:08:12
最近在写实验室管理系统中的个人信息模块,上边要求实现更改头像功能。百度了一大堆,无实用的。(要么各种币)
本文介绍的只是实现了简单功能(毕竟现在初学阶段)
需要引用文件,顺序也不能错。
<script src="~/JS/bootstrap/js/jquery.min.js"></script>
<script src="~/JS/bootstrap/js/bootstrap.min.js"></script>
<script src="~/JS/jquery.ui.widget.js"></script>
<script src="~/JS/jquery.iframe-transport.js"></script>
<script src="~/JS/jquery.fileupload.js"></script>
文件链接:http://pan.baidu.com/s/1skH0xnZ
<div class="widget-user-image">
<img class="img-circle" id="appear" src="../../images/user.jpg" alt="User Avatar" >
</div>
<input type="file" id="fileupload" name="files" multiple>
<button class=" btn btn-primary" id="Start">修改头像</button>
jQuery
<script type="text/javascript"> $('#fileupload').fileupload({ url: "/Info/img",
Type: "POST",
dataType: 'json',
autoUpload: true,
acceptFileTypes: "/(\.|\/)(gif|jpe?g|png|xlsx)$/i",
add: function (e, data) {
$("#Start").click(function () {
data.submit();
})
alert("已选择文件,可以更新头像!");
},
success: function (response, status) {
var obj = JSON.parse(response);
var imgPath = "../.." + obj["filePath"];
//$("#imglist").append('<li><img src="' + imgPath + '" /> </li>');
$('#appear').attr("src",imgPath); },
done: function (e, data) {
alert("update finish");
},
error: function (error) {
alert("error");
},
});
</script>
C#方法
public JsonResult img(HttpPostedFileBase files)
{
try
{
string localPath = "/images";
string path = Server.MapPath("~" + localPath);
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
//TimeSpan ts = DateTime.Now - TimeZone.CurrentTimeZone.ToLocalTime(new DateTime(1970, 1, 1));
//string fileName = (long)ts.TotalMilliseconds + Path.GetExtension(files.FileName);
string fileName = files.FileName;
files.SaveAs(path + "/" + fileName);
return Json("{\"filePath\":\"" + localPath + "/" + fileName + "\",\"sourePath\":\"" + files.FileName + "\"}"); }
catch (Exception ex)
{
return null;
}
}
可以实现简单头像更新。至此
最新文章
- ES6之let命令详解
- WCF、Web API、WCF REST、Web Service比较
- unity之自制玻璃啤酒瓶shader
- 【BZOJ 1875】【SDOI 2009】HH去散步
- ubuntu下Eclipse安装
- cordova 学习笔记
- POJ 2499 Binary Tree
- Dalvik指令集
- VS2015, .NET 4.6, C# 6.0, F# 4.0等重量级产品正式上线
- java-web中生成文档(一)
- 关于JetBrains CLion 激活 (CLion License Activation)的解决办法,带hosts详细修改
- Android JNI开发之C/C++层调用JAVA
- [ZJOI2010]基站选址
- 【学习总结】GirlsInAI ML-diary day-1-初识Python-Anaconda-Jupyter
- javaSE eclipse tomocat安装与配置
- Hdu2191 悼念512汶川大地震遇难同胞——珍惜现在,感恩生活 (多重背包)
- 数据库历险记(二) | Redis 和 Mecached 到底哪个好?
- Yii 框架的Rbac [权限控制]
- android使用POI读写word doc文件
- IOS沙盒机制
热门文章
- 【6.18校内test】T1多项式输出
- GPIB、USB、PCI、PCI Express和以太网/LAN/LXI
- div距离左边设置
- 上载和下载CSV文件
- java冒泡排序小实例
- java 如何读取 properties 配置文件
- TCP的.cc文件代码解释(中文)
- ld - GNU linker (连接器)
- Linux学习--第十二天--服务、ps、top、pstree、kill、&;、jobs、fg、vmstat、dmesg、free、uptime、uname、crontab、ls
- kloxo增加了域名,怎么不能访问?如何重启web服务?