当我从通过 Ajax 调用的 REST 方法返回动态生成的 html 时，我正在替换页面上的 html，如下所示:
[HttpGet]
[Route("{unit}/{begdate}/{enddate}", Name = "QuadrantData")]
public HttpResponseMessage GetQuadrantData(string unit, string begdate, string enddate)
{
_unit = unit;
_beginDate = begdate;
_endDate = enddate;
string beginningHtml = GetBeginningHTML(); // This could be called from any page to reuse the same "header"
string bodyBeginningHtml = GetBodyBeginHTML();
string top10ItemsPurchasedHtml = GetTop10ItemsPurchasedHTML();
string pricingExceptionsHtml = GetPriceComplianceHTML();
string forecastedSpendHtml = GetForecastedSpendHTML();
string deliveryPerformanceHtml = GetDeliveryPerformanceHTML();
string endingHtml = GetEndingHTML();
String HtmlToDisplay = string.Format("{0}{1}{2}{3}{4}{5}{6}",
beginningHtml,
bodyBeginningHtml,
top10ItemsPurchasedHtml,
pricingExceptionsHtml,
forecastedSpendHtml,
deliveryPerformanceHtml,
endingHtml);
return new HttpResponseMessage()
{
Content = new StringContent(
HtmlToDisplay,
Encoding.UTF8,
"text/html"
)
};
}
它是从就绪函数中调用的(当单击按钮时)，如下所示:
$(document).ready(function () {
$("body").on("click", "#btnGetData",
function () {
var _begdate = $("#datepickerFrom").val();
var _enddate = $("#datepickerTo").val();
var _unit = $("#unitName").text();
$("#newhourglass").removeClass("hide");
$.ajax({
type: 'GET',
url:
'@Url.RouteUrl(routeName: "QuadrantData", routeValues
new { httpRoute = true, unit = "un", begdate = "bd", enddate = "ed" })'
.replace("un", encodeURIComponent(_unit))
.replace("bd", encodeURIComponent(_begdate))
.replace("ed", encodeURIComponent(_enddate)),
contentType: 'text/plain',
cache: false,
xhrFields: {
withCredentials: false
},
success: function (returneddata) {
$("body").html(returneddata);
$("#newhourglass").addClass("hide");
},
error: function () {
console.log('error in ajax call to QuadrantData');
$("#newhourglass").addClass("hide");
}
});
});
. . .
名为“HtmlToDisplay”(Ajax 调用中的“returneddata”)的字符串开头如下:
<!DOCTYPE html><html><head><meta charset=\"utf-8\"><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"><title>eServices Reporting - Customer Dashboard</title><link rel=\"stylesheet\" href=\"http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css\"><script src= . . .
如您所见，它不是以虚假/多余的“body”标签开头，但是当我在 Chrome 开发工具中通过 F12 查看页面源代码时，第一件事(“<!DOCTYPE html>”上方和其余部分) 是“<body>”
为什么是<body>在那里？
在 Chrome 开发工具的控制台中，有一条错误消息“Uncaught SyntaxError: Unexpected token var”
当我双击它时，它会将我带到“<body>”标签。
所以我不仅想知道为什么“<body>”在那里，而且还想知道为什么 Chrome 开发工具显然认为它是一个名为“var”的标记
在尝试替换原始 html 之前，我仔细比较了“HtmlToDisplay”的内容和 html 页面源代码，没有发现明显的差异(只是字符串的转义(“\”)符号等)。
为什么 Chrome 会打一个 <body>标记在我的 HTML 顶部，为什么在两次单击“Uncaught SyntaxError: Unexpected token var”控制台错误消息时它会带我到那里？
更新
尽管它很奇怪，至少看起来很奇怪，但我不认为多余/虚假的 <body>标签确实是问题所在，因为出于某种原因它也在未修改的页面上 - 在我点击按钮替换 html 之前，页面(查看页面源代码)开始:
<body>
<!DOCTYPE html>
<html>
<head>
更新 2
这个多余/虚假的“<body>”标签显然来自 _Layout.cshtml，它是:
<body>
@RenderBody()
<hr />
<footer>
<p> © @DateTime.Now.Year - PRO*ACT USA</p>
</footer>
</body>
当我同时删除(打开和关闭)时 <body>标签，谜团解开了——它们不再出现在 html 中。
不过，我仍然有同样的基本问题；只是当单击 2 次时，控制台中的错误消息现在会转到“<!DOCTYPE html>”上方的空行。
为什么 html 以空行开头，这是否存在潜在问题？
文档第 1 行的初始空行同时出现在查看页面源代码和 Chrome 开发工具中。
最佳答案
查看错误消息 Uncaught SyntaxError: Unexpected token var 我认为它与 HTML 无关，而是与嵌入的 JS 代码有关在你的 HTML 中。
在声明下一个 var 之前，您是否缺少分号/括号/语句结尾？我会建议您将完整的 returneddata 复制到您喜欢的编辑器并搜索所有 var 以查看 previous line.
关于c# - 为什么 Chrome 会在我的 HTML 顶部添加一个正文，然后给我一个看似虚假的 err 消息？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/39862551/