【问题标题】:asp.net mvc: How to image map?asp.net mvc:如何图像映射?
【发布时间】:2009-08-31 03:35:14
【问题描述】:

如何在 ASP.NET MVC 中构建图像映射?参考:

<map id='headerMap'>
    <area shape='rect' href="Default.aspx" coords='300,18,673,109' />
</map>

markus 对一个不相关问题的回答的一个答案是类似的:

<a href="<%= Url.RouteUrl("MyRoute", new { param1 = "bla", param2 = 5 }) %>">
   put in <span>whatever</span> you want, also <img src="a.gif" alt="images" />.
</a>

对不起,如果这是多余的。我的研究表明这可能是第 2 版 mvc 答案。寻找类似于 Html.ActionLink 的东西(如果存在)。显然,我可以通过名称引用路由并使用该 Url.RouteUrl 发送参数,但这是处理它的事实上的方式吗?

谢谢

【问题讨论】:

    标签: asp.net-mvc actionlink imagemap


    【解决方案1】:

    您必须自己创建 HTML...看看在经典 asp.net 中呈现的 html 使用:

    <map id='headerMap'>
        <area shape='rect' href="Default.aspx" coords='300,18,673,109' />
    </map>
    

    然后在你自己的 asp.net mvc 视图中模仿它,用你的 Url.RouteUrl 调用替换地图的任何 href。

    例如

    <map id="mymap" name="mymap">
        <area href="<%= Url.RouteUrl("MyRoute", new { param1 = "foo", param2 = 5 }) %>" alt="HTML and CSS Reference" shape="rect" coords="5,5,95,195">
        <area href="<%= Url.RouteUrl("MyRoute", new { param1 = "bar", param2 = 3 }) %>" alt="Design Guide" shape="rect" coords="105,5,195,195">
    </map>
    <image src="sitemap.gif" alt="Site map" "usemap"="#mymap" width="300" height="200">
    

    查看不同的 Url.RouteUrl() 重载和/或 UrlHelper 方法,看看哪个最适合您的情况。

    一旦您解决了这个问题,我的建议是将您的区域链接的创建封装到 HtmlHelper 扩展中。

    【讨论】:

      【解决方案2】:

      我能够替换以下内容并且效果很好:

      html 示例:

      <map id='headerMap'>
         <area shape='rect' href="Default.aspx" coords='300,18,673,109' />
      </map>
      

      mvc4 示例

      <map id='headerMap'>
          <area shape="rect" href=@Url.Action("Default", "Home") coords="300,18,673,109">
      </map>
      

      【讨论】:

        【解决方案3】:

        另一种选择是使用 c# 构建图像映射。以下链接提供了一些帮助方法,可从您的视图/控制器中的代码创建图像映射:

        http://www.avantprime.com/articles/view-article/9/asp.net-mvc-image-map-helper

        编辑:尝试http://web.archive.org/web/20110728032820/http://www.avantprime.com/articles/view-article/9/asp.net-mvc-image-map-helper 获取原始链接的存档版本。

        【讨论】:

          猜你喜欢
          • 2014-11-13
          • 1970-01-01
          • 2010-09-05
          • 1970-01-01
          • 2011-01-15
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2012-09-03
          相关资源
          最近更新 更多