asp.net 实现 点击checkbox ,弹出一个file文件框 保存文件 前台和後台怎样写
2个回答
展开全部
其实你的代码和这个例子差不多的。
把文本框改成checkbox，去掉预览代码 就行了。
<!DOCTYPE html>
<html>
<head>
<title>Index</title>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script src="jquery.form.js" type="text/javascript"></script>
<script type="text/javascript">
function selectImage(obj) {
var inputId = obj.id;
document.getElementById('btnSure').setAttribute('inputId', inputId);
var x = window.event.x;
var y = window.event.y;
var uploadDiv = document.getElementById('uploadDiv');
uploadDiv.style.left = x + 10 + 'px';
uploadDiv.style.top = y + 10 + 'px';
uploadDiv.style.position = 'fixed';
uploadDiv.style.display = 'inline';
}
function closeDiv() {
document.getElementById('btnSure').style.display = 'none';
document.getElementById('showImage').style.display = 'none';
document.getElementById('uploadDiv').style.display = 'none';
}
function makeSure(obj) {
var inputId = obj.getAttribute('inputId');
document.getElementById(inputId).value = document.getElementById('showImage').getAttribute('big');
document.getElementById('small' + inputId).value = document.getElementById('showImage').getAttribute('small');
document.getElementById('image' + inputId).src = document.getElementById('showImage').getAttribute('small');
document.getElementById("btnSure").style.display = 'none';
document.getElementById('showImage').style.display = 'none';
document.getElementById('uploadDiv').style.display = 'none';
}
$(function () {
//异步上传图片
$('#btnUpload').click(function () {
if ($('#upImage').val() == '') {
alert('请选择一张图片文件');
return;
}
$('#fileForm').ajaxSubmit({
success: function (msg) {
var strJSON = msg; //得到的JSON
var image = eval("(" + strJSON + ")"); //转换后的JSON对象
document.getElementById('uploading').style.display = 'none';
$('#showImage').css('display', 'inline');
$('#showImage').attr('src', image.big);
$('#showImage').attr('big', image.big);
$('#showImage').attr('small', image.small);
$('#btnSure').css('display', 'inline');
}
});
document.getElementById('uploading').style.display = 'block';
});
});
</script>
</head>
<body>
<p>上传单个文件或图片</p>
<div>
<input type="text" name="url1" id="bigImage1" style="width:150px;" onclick="selectImage(this)" />
<input type="hidden" name="smallUrl1" id="smallbigImage1" value="" />
</div>
<div id="uploadDiv" style="width: 400px; height: 280px; border: 1px solid #9eb9f1;
background-color: #e1eaea; text-align:left; display:none; z-index:999;">
<div>
<div style="width: 376px; float: left; padding-left:4px; padding-top:4px; padding-bottom:4px; overflow:hidden;">
<form id="fileForm" method="post" action="/Home/UploadImage" enctype="multipart/form-data" >
<input type="file" id="upImage" name="upImage" style="padding-bottom: 1px; padding-left: 8px;
padding-right: 8px; height: 24px; width:220px; padding-top: 1px;" />
<input type="button" id="btnUpload" value="上传" style="padding-bottom: 1px; padding-left: 8px; padding-right: 8px;
height: 24px; cursor: pointer; padding-top: 1px; line-height: 12px;" />
<span id="uploading" style="color:#ff0000; display:none; font-size:14px; font-weight:bold;">上传中......</span>
<input type="button" id="btnSure" value="确定" style="padding-bottom: 1px; padding-left: 8px; padding-right: 8px;
height: 24px; cursor: pointer; padding-top: 1px; line-height: 12px; display:none; background-color:#9fd0f9;" onclick="makeSure(this)" />
</form>
</div>
<div style="width: 20px; height: 30px; float: right; ">
<div style="width: 20px; height: 20px; background-color:#9fc0f7; font-size:20px; text-align:center; line-height:16px; cursor:pointer;" onclick="closeDiv()">X</div>
</div>
</div>
<div style="width:398px; height:240px; text-align:center; overflow:hidden; ">
<img id="showImage" alt="预览图片" src="" style="width: 340px; display:none;" />
</div>
</div>
</body>
</html>
/// <summary>
/// 上传图片（图片也是文件）
/// </summary>
/// <returns></returns>
public ActionResult UploadImage()
{
//定义错误消息
JsonResult msg = new JsonResult();
try
{
//接受上传文件
HttpPostedFileBase postFile = Request.Files["upImage"];
if (postFile != null)
{
DateTime time = DateTime.Now;
//获取上传目录 转换为物理路径
string uploadPath = Server.MapPath("~/UploadFiles/" + time.Year + "/" + time.ToString("yyyyMMdd") + "/");
//文件名
string fileName = time.ToString("yyyyMMddHHmmssfff");
//后缀名称
string filetrype = System.IO.Path.GetExtension(postFile.FileName);
//获取文件大小
long contentLength = postFile.ContentLength;
//文件不能大于2M
if (contentLength <= 1024 * 2048)
{
//如果不存在path目录
if (!Directory.Exists(uploadPath))
{
//那么就创建它
Directory.CreateDirectory(uploadPath);
}
//保存文件的物理路径
string saveFile = uploadPath + fileName + "_big" + filetrype;
try
{
//保存文件
postFile.SaveAs(saveFile);
//保存缩略图的物理路径
string small = uploadPath + fileName + "_small" + filetrype;
MakeThumbnail(saveFile, small, 320, 240, "W");
ReturnImage image = new ReturnImage();
image.big = "/UploadFiles/" + time.Year + "/" + time.ToString("yyyyMMdd") + "/" + fileName + "_big" + filetrype;
image.small = "/UploadFiles/" + time.Year + "/" + time.ToString("yyyyMMdd") + "/" + fileName + "_small" + filetrype;
msg = Json(image);
}
catch
{
msg = Json("上传失败");
}
}
else
{
msg = Json("文件大小超过限制要求");
}
}
else
{
msg = Json("请选择文件");
}
}
catch (Exception e)
{
;
}
msg.ContentType = "text/html";
return msg;
}
更多追问追答
追问
上传pdf可以吗?`(*>﹏<*)′
追答
肯定可以啊，上面的代码很简单的，稍加修改就可以了
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
