如何在JSP内将正确的HTML写入内联Javascript？
[英]How can one write correct HTML to an inline Javascript inside a JSP?
问题描述
Due to some reasons, I have to load two separate page header HTMLs in my page. 
由于某些原因，我必须在页面中加载两个单独的页面标题HTML。 One of them is a header for mobile view, and the other is for the desktop view. 其中一个是用于移动视图的标题，另一个是用于桌面视图的标题。 The rest of my page is responsive. 我页面的其余部分都是响应式的。 My plan is to load both headers' HTMLs inside a JS that loads on page load and depending on page width populate the correct header's HTML inside my page, and hope the corresponding JS and CSS to load. 我的计划是在页面加载时加载的JS内加载两个标头的HTML，并根据页面宽度在页面内填充正确的标头HTML，并希望加载相应的JS和CSS。 I am doing this since the JS and CSS of the two header HTMLs are prone to clashing (and I can't tinker with these HTMLs), so I want only of them to load on a page load. 我这样做是因为两个标头HTML的JS和CSS容易发生冲突（并且我无法修改这些HTML），所以我只希望它们在页面加载时加载。
The problem is in writing HTML in JSP inside this inline JS. 问题是在此内联JS中用JSP编写HTML。 I repeatedly get errors like "Uncaught SyntaxError: Unexpected token ILLEGAL". 我反复收到诸如“ Uncaught SyntaxError：Unexpected token ILLEGAL”的错误。
My code in JSP looks like this: 我在JSP中的代码如下所示：
<c:when test="${not empty hdrLoggedInHtml and not empty hdrLoggedInHtml_M}">
<script type="text/javascript">
$(document).ready(function(){
if($(window).width()>420)
{
$("#desktopHeader").html('<c:out value="${hdrLoggedInHtml}" escapeXml="false"/>');
$("#mobileHeader").html("");
}else
{
$("#mobileHeader").html('<c:out value="${hdrLoggedInHtml_M}" escapeXml="false"/>');
$("#desktopHeader").html("");
}
});
});
</script>
</c:when>
I tried using fn:escapeXml but that didn't work either. 我尝试使用fn：escapeXml，但这也不起作用。 It seems to me that the new line after <html> inside the string is not getting output properly or some invisible character is coming somehow. 在我看来，字符串内<html>之后的新行无法正确输出，或者某种不可见的字符以某种方式出现。 Please help. 请帮忙。
1 个解决方案
解决方案1
0 2015-01-20 06:13:46
Put hdrLoggedInHtml into a html node which is display:none before it,like: 将hdrLoggedInHtml放到html节点上，该节点之前没有显示：
<script>
var global = {} ; global.url = '${url}';global.data = $.parseJSON('${data}');
</script>
and then,put the script at the bottom of the JSP page ,here is one example: 然后，将脚本放在JSP页面的底部，这是一个示例：
<script type="text/javascript">
$(document).ready(function(){
if($(window).width()>420)
{
$("#desktopHeader").load(global.url,global.data);
$("#mobileHeader").html("");
}else
{
$("#mobileHeader").html($('#'));
$("#desktopHeader").html("");
}
});
});
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.