如何获取文件流中的图片路径?

嗜血狂魔 2016-04-21 01:12:17
如题,我用文件流的方式上传一张照片,现在我想把文件路径获取出来,却不知道该怎么做,求助。
这是js:

$("#userImg").change(function () {
if (FileReader) {
var reader = new FileReader(), file = this.files[0];
reader.onload = function (e) {
$("#userImage").attr("src", e.target.result);
$("#smallImg").attr("src", e.target.result);
};
reader.readAsDataURL(file);
$("#imgUrl").val();
}

var jcrop_api, boundx, boundy;
$("#userImage").Jcrop({
onChange: updatePreview,
onSelect: updatePreview,
aspectRatio: 1,
maxSize: [300, 300],
minSize: [50, 50],
setSelect: [0, 0, 100, 100]
}, function () {
var bounds = this.getBounds();
boundx = bounds[0];
boundy = bounds[1];

jcrop_api = this;
});

function updatePreview(c) {
if (parseInt(c.w) > 0) {
var rx = 120 / c.w;
var ry = 120 / c.h;

$("#smallImg").css({
width: Math.round(rx * boundx) + "px",
height: Math.round(ry * boundy) + "px",
marginLeft: "-" + Math.round(rx * c.x) + "px",
marginTop: "-" + Math.round(ry * c.y) + "px"
});
}

$("#point").val(c.x + "," + c.y + "," + c.x2 + "," + c.y2 + "," + c.w + "," + c.h);
}
});


这是html:

<div id="tab_3-4" class="tab-pane">
<form id="UserInfoForm" class="form-horizontal form-bordered form-row-stripped" method="post">
<div class="form-body">
<div class="alert alert-success display-hide">
<button class="close" data-close="alert"></button>
<span id="danger"></span>
</div>
<div class="alert alert-success display-hide">
<button class="close" data-close="alert"></button>
<span id="success"></span>
</div>
<div>
<div style="display: none;"></div>
</div>
<div class="form-group">
<label class="control-label col-md-3">头像</label>
<div class="col-md-4">
<div class="input-group">
@*<span class="input-group-addon"><i class="fa fa-lock"></i></span>*@
<input type="file" id="userImg" name="userImg" value="" />
</div>
<div class="col-md-4">
<span>原始图片</span>
<img id="userImage" style="max-width: 300px; max-height:300px; height: 300px; width: 300px;" alt="" />
<div style="width: 100px; height: 100px; overflow: hidden;">
<span>最终显示效果</span>
<div style="width: 120px; height: 120px; overflow: hidden;">
<img id="smallImg" alt="" />
<input type="hidden" id="point" name="point" value="" />
<input type="hidden" id="imgUrl" name="imgUrl" value="" />
</div>
</div>
</div>
</div>
</div>
</div>
<div class="form-actions fluid">
<div class="row">
<div class="col-md-12">
<div class="col-md-offset-3 col-md-9">
<a id="Save" class="btn btn-primary">保存</a>
<a href="#" class="btn default" id="Cancel">返回</a>
</div>
</div>
</div>
</div>
</form>
</div>


直接取value和src的就不用说了,如果有用的话我不会用这么麻烦的方式。还有我用的视图框架是Razor,所以服务器控件也不用说了,求高手指教,谢谢。
...全文
182 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
likevs 2016-04-21
  • 打赏
  • 举报
回复
我记忆中多年之前好像尝试过.outerHTML属性,不过好像最后也没成功的话

62,046

社区成员

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见,支持健康理性的辩论和互动,反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧