上一篇《MVC应用程序显示上传的图片》http://www.cnblogs.com/insus/p/3597543.html 最后有提及没有实现用户点击图片，显示原图的功能。此篇Insus.NET来完成它。

想使用一个dialog box来呈现原图。这个jQuery的UI已经有了，引用相关的js类库即可。

代到HomeController.cs控制器，添加一个ContentResult方法：

即是传入图片名称，找到上传目录的相对应的图片。
打开ViewUploadPhoto.cshtml 视图，在html节点中，添加一个DIV tag，将是用来呈现dialog窗口，显示图片。

去掉一个较低版本的jQuery库，使用jQuery2.0.2，还要引用jQuery UI的css和js库。

接下来，我们可以dialog打开，加载图片显示：

运行看看：

MVC应用程序显示上传的图片(续)的更多相关文章

  1. MVC应用程序显示上传的图片

    MVC应用程序显示上传的图片 前两篇<MVC应用程序实现上传文件>http://www.cnblogs.com/insus/p/3590907.html和<MVC应用程序实现上传文件 ...

  2. MVC应用程序实现上传文件(续)

    前几天,有练习了<MVC应用程序实现上传文件>http://www.cnblogs.com/insus/p/3590907.html 那只是把文档上传至MVC应用程序下的某一目录之中. 其 ...

  3. html上传图片后，在页面显示上传的图片

    html上传图片后,在页面显示上传的图片 1.html <form class="container" enctype="multipart/form-data&q ...

  4. MVC应用程序实现上传文件

    学习MVC以来,一直想实现上传文件的功能,使用jQuery来实现上传,有很多插件.此篇演示中,Insus.NET是使用Uploadify.http://www.uploadify.com/,它有更多的 ...

  5. .net 实现的上传下载，如果是图片就显示上传的图片

    HTML: <div> <input id="fileUpload" type="file" runat="server" ...

  6. ASP.NET MVC在服务端把异步上传的图片裁剪成不同尺寸分别保存,并设置上传目录的尺寸限制

    我曾经试过使用JSAjaxFileUploader插件来把文件.照片以异步的方式上传,就像"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01- ...

  7. KindEditor上传本地图片在ASP.NET MVC的配置

    http://www.cnblogs.com/upupto/archive/2010/08/24/1807202.html 本文解决KindEditor上传本地图片在ASP.NET MVC中的配置. ...

  8. MVC&WebForm对照学习：文件上传(以图片为例)

    原文  http://www.tuicool.com/articles/myM7fe 主题 HTMLMVC模式Asp.net 博客园::首页::  ::  ::  ::管理 5 Posts :: 0 ...

  9. ASP.NET MVC应用程序把文字写在图片上

    原文:ASP.NET MVC应用程序把文字写在图片上 Insus.NET实现这篇<MVC把随机产生的字符串转换为图片>http://www.cnblogs.com/insus/p/3624 ...

随机推荐

  1. Android-available for offline mode

    出现 available for offline mode 字样的异常: 取消打钩 Offine work 点击sync project ..... 成功解决:

  2. Linux-压缩与归档

    压缩:gzip/gunzip.bzip2/bunzip2.xz/unxz 归档:tar ####归档+压缩:zip 1. gzip, gunzip, zcat - compress or expand ...

  3. JQuery实用技巧

    1.关于页面元素的引用通过jquery的$()引用元素包括通过id.class.元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom ...

  4. JS通过ClassName禁止DIV点击

    //通过ClassName获取div,使用setAttribute设置div禁止点击 var itemRoom= document.getElementsByClassName("page- ...

  5. 初识node.js（通过npm下载项目依赖的包的过程）

    一.初识node.js 简单的说Node.js 就是运行在服务器端的JavaScript. Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台. Node.js是一个事 ...

  6. spring cloud学习(一) 服务注册

    首先spring-cloud相关的简介可以去百度搜索,这里就不多说了,这里分享一个翻译spring cloud官网的中文网站spring cloud中文网 这个学习项目的代码放在 https://gi ...

  7. Android常用布局属性解析 -- Layout_weight

    Layout_weight是Android开发中一个比较常用的布局属性,在面试中也经常被问到.下面通过实例彻底搞懂Layout_weight的用法. 先看下面的布局代码: <?xml versi ...

  8. [JavaScript] js实现保存文件到本地

    function fake_click(obj) { var ev = document.createEvent("MouseEvents"); ev.initMouseEvent ...

  9. 微信小程序之模版的使用（template）

    WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用. 分为两部分,定义模板和使用模板 (1).定义模板:使用 name 属性,作为模板的名字.然后在<templ ...

  10. 简单理解jQuery中$.getJSON、$.get、$.post、$.ajax用法

    在WEB开发中异步请求方式普遍使用,ajax技术减少程序员的工作量,也提升用户交互体验.AJAX的四种异步请求方式都能实现基本需求,闲话不多说,直接切入正题. 1.$.getJSON $.getJSO ...