MVC4 Razor View中出现奇怪的空白

时间:2012-09-26 12:41:41

标签: asp.net-mvc razor asp.net-mvc-4

我正在ASP.Net MVC4中开发一个应用程序,我遇到了一个奇怪的空白问题。我已经使用Razor开发了大量MVC3站点而没有这个问题。

这是我的模板cshtml文件:

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>HF - Content Management - @ViewBag.Title</title>
    <link href="@Url.Content("~/content/bootstrap/bootstrap.min.css")" rel="stylesheet" />
    @Styles.Render("~/bundles/css/hf-cms-logged-in")
</head>
    <body>

        @Html.Partial("Partials/NavBar")

        <div class="container">@RenderBody()</div>

        <script src="http://code.jquery.com/jquery-latest.js"></script>
        <script src="@Url.Content("~/scripts/bootstrap/bootstrap.min.js")"></script>
        @Scripts.Render("~/bundles/js/validation")
        <script src="@Url.Content("~/scripts/hf-cms.js")"></script>
    </body>
</html>

注意RenderBody()调用的行 - 这里没有多余的空格。

当我调用一个动作时,渲染的主体前面有一些我看不到的空白,我已经添加了,似乎无法摆脱。我调用没有逻辑的动作,它只返回以下视图:

@{
    ViewBag.Title = "Dashboard";
}    
<h1>Dashboard</h1>

它肯定使用了正确的模板(在我的_ViewStart.cshtml中指定)

在Google Chrome中查看该页面,源会显示额外的空白。见下图:

Whitespace shown in Google Chrome developer tools

在IE10中可以看到类似的问题。这显然会影响设计。我尝试使用Meleze.Web删除任何额外的空格,但空白仍然存在。

我对此感到茫然,因为到目前为止这是一个相对简单的网站,还没有什么好玩的,所以我看不出这个空白的来源。

之前有没有人用MVC4或Razor看过这个?

编辑:我已经尝试删除所有样式表和脚本文件,空格仍然存在。

7 个答案:

答案 0 :(得分:9)

经过一段时间的努力,我找到了解决方案。

根_ViewStart.cshtml文件中一定有一个有趣的字符。我删除了ViewStart文件的内容并重新输入,这解决了问题。 This让我觉得一个奇怪的角色可能会导致这个问题。

不喜欢回答我自己的问题,但我希望这有助于其他人。从理论上讲,这不是MVC4特有的问题,你可能在MVC3中遇到同样的问题。

答案 1 :(得分:5)

我遇到了同样的问题,史蒂夫的回答让我走上正轨,这可能是文件中嵌入的一个不寻常的角色。

就我而言,它在文件的开头被证明是一个重复的Unicode字节顺序标记(0xEFBBBF)。当我从Git Extensions差异视图中复制并粘贴文件内容时,它似乎已经悄悄进入。

顺便提一下,Visual Studio有一个内置的Hex查看器。如果右键单击解决方案资源管理器中的文件,然后单击&#34;打开方式...&#34;你可以选择&#34; Binary Editor&#34;。

答案 2 :(得分:1)

我遇到了同样的问题,并尝试了你提出的方法,史蒂夫。但是,这并没有解决我的问题。我发现导致问题的是我子页面顶部的h2标签:

<h2>@ViewData("Title")</h2>

当我删除包装标签时,一切正常:

@ViewData

作为一个测试,我把h2的样式放在他们自己的类中,然后用一个跨度包装我的页面标题内容:

<span class="pagetitle">@ViewData("Title")</span>

这很好,我的网站问题也是如此。虽然我不知道真正的根本原因,但这确实解决了我的问题,所以也许它会帮助其他人。

答案 3 :(得分:1)

我刚刚遇到了类似的问题 - 在我看来,视图顶部的@using指令之一导致了一个问题。我在项目中的几个不同视图中发现了同样的事情。

帮助我找到有问题的字符的一件事就是将整个视图的内容粘贴到记事本中 - 很明显,所讨论的行以某种方式编码不同(它们看起来比其他行小,即使在记事本中)。删除这些行并从头开始重写它们解决了这个问题,尽管我很遗憾没有一个人能够更加明智地进入这个位置......

答案 4 :(得分:0)

我遇到了同样的问题,感谢这里的线索,我能够找出问题所在。

经过大量调查后,我发现在页面开头有一个Unicode字符“零宽度不间断空格”。将此字符保存/编码为“带BOM的UTF-8”时,会将其添加到页面中。我只能猜测该页面是在visual studio之外编辑的,是从其他地方复制的,或者可能是VS中的页面编码设置不正确。你在其他答案中说过,你可以通过查看曾经复制并粘贴到记事本中看到它。

答案 5 :(得分:0)

我遇到了同样的问题,我将其修复为: - 将数据库中的列(字段)数据类型从nchar更改为nvarchar。  这是因为nchar保留固定长度,因此如果你的字符串比这个长度短,它将用空格完成它。

答案 6 :(得分:0)

我有类似的问题,但是更明显的解决方案。在方法调用之后,我的Html.Partial()元素中包含<head> ; <head> @await Html.PartialAsync("Test"); // The ";" is rendered in the body, remove it! </head> <body> ... </body> 。这又在身体中呈现。

run_tesseract