HTML 代码弄乱了以下 URL

Question

我正在将 Visual Studio 2012 用于使用 EF 5.0 的代码优先方法的 MVC Web 应用程序。 我编写了以下代码来使模态窗口出现在某个点：

<div id="mod" style="display:none;">
    <div id="mod-container">  
        <div id="mod-close"><img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/></div>   
        <div id="mod-content"></div>
    </div>
</div>

如果工作正常，除了认为其 URL 为的浏览器无法找到图像 <img src="~/Content/icons/close.png" [...] /> 之外

http://localhost:49895/Class1/Home/~/Content/icons/close.png

准确地说，我的 div 下 下的每个代码都有损坏的 URL。如果我将我的图像放在 div 上方，它会通过以下 URL 正确显示：

http://localhost:49895/Content/icons/edit.png

你知道我把事情搞砸了吗？

Edit2：示例（问题解决后）

这行得通：

<img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/>
<!-- comment containing a quote ' -->
<div id="mod" style="display:none;">
    <div id="mod-container">  
        <div id="mod-close"></div>   
        <div id="mod-content"></div>
    </div>
</div>

这不起作用：

<!-- comment containing a quote ' -->
<div id="mod" style="display:none;">
    <div id="mod-container">  
        <div id="mod-close"></div>   
        <div id="mod-content"></div>
    </div>
</div>
<img src="~/Content/icons/close.png" title="close" onclick="$('#mod').fadeOut();"/>

Answer 1

可能是新的 Razor 2.0 波浪号解析中的错误，或者您因缺少引号或其他内容而弄乱了您的 html。尝试使用更明确的方式来解析 url

<img src="@Url.Content("~/Content/icons/close.png")" />

如果可行，则表明存在剃刀错误，如果不可行，则您的 html 可能以某种方式损坏，但额外的 @ 符号可能足以让解析器启动并告诉您出了什么问题。

Answer 2

~ 是一个 asp 代码元素，而不是 HTML。因此，它不会被 HTML 呈现。

尝试用@Url.Content包装你的src

<img src="@Url.Content("~/Content/icons/close.png")" />