码迷,mamicode.com
首页 > Web开发 > 详细

2015第23周四HTML特殊字符显示问题

时间:2015-06-04 20:57:55      阅读:213      评论:0      收藏:0      [点我收藏+]

标签:

1.项目中常采用EL表达式来输出后台内容,但测试发现它并不能完美处理要输出内容包含有<>或&等HTML特殊字符问题。先直接给出此问题JSTL的解决方案:
1、引入标签:<%@ taglib uri ="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>

这样取值:<input  id="name" value="${fn:escapeXml(name)}" type="text"/> 其中name为后台要输出值,如果直接用${name}且name值为&nbsp;时文本框中就是空格而不是&nbsp;

2、用JSTL标签显示不转义的字符:<c:out value="<%=name%>" escapeXml="false"/>

不如直接用structs标签处理:<s:property value="name" >

另外注意该标签其它两个属性:

default属性

用于设置默认的值,在无法找到value表示的属性时,其值便直接取default值。比如

  1. <s:property value="name" default="anonymity"/>   
表示的是,如果值栈中能取到name,那么就显示取到的值;如果取不到,那么就用"anonymity".

escape属性

1)默认是true,表示将value内的内容强制转换成字符串显示
2)设置成false,表示将value值当做html代码去解析。此时如name值为&nbsp;前台就显示为空白,跟EL表达式的默认情况一样。

不知为何EL表达式不像s:property一样把value内容强制转换为字符串显示处理,这样默认应该更合理。

EL 全名为Expression Language,它原本是JSTL 1.0为方便存取数据所自定义的语言。当时EL只能在JSTL 标签中使用,不能直接在JSP 网页中使用。到了JSP 2.0 之后,只要是支持Servlet 2.4 / JSP2.0 的Container,就都可以在JSP 网页中直接使用EL 了,需要引入页签:

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> 

最后转一篇其它特殊字符处理的文章: <HTML、JS、JSON特殊字符 - JS到HTML特殊字符转换 - kobejayandy的专栏 - 博客频道 - CSDN.NET>

这几天做项目,发现从服务器端以JSON格式将数据传递到客户端后,通过JS显示在HTML页面时,有一些特殊字符不能直接显示,如后台传递过来的是 ‘<b>msg</b>&nbsp;&#35;‘ 通过JS显示在HTML页面中时,显示成了msg # ,并不是<b>msg</b>&nbsp;&#35;,这是由于<与>之间的内容看作是HTML标签了,而以&开头的&nbsp;&#35;为HTML实体,所以显示不正常。

解决办法很简单,在JS将其渲染到HTML页面前转换一下即可:

Html代码 技术分享
  1. <html>
  2. <body>
  3. <div id="div1" ></div>
  4. <div id="div2" ></div>
  5. <script >
  6. var str = ‘<b>msg</b>&nbsp;&#35;‘;
  7. document.all.div1.innerHTML=‘<pre>‘+str+‘</pre>‘;
  8. //js中的字符串正常显示在HTML页面中
  9. String.prototype.displayHtml= function(){
  10. //将字符串转换成数组
  11. var strArr = this.split(‘‘);
  12. //HTML页面特殊字符显示,空格本质不是,但多个空格时浏览器默认只显示一个,所以替换
  13. var htmlChar="&<>";
  14. for(var i = 0; i< str.length;i++){
  15. //查找是否含有特殊的HTML字符
  16. if(htmlChar.indexOf(str.charAt(i)) !=-1){
  17. //如果存在,则将它们转换成对应的HTML实体
  18. switch (str.charAt(i)) {
  19. case ‘<‘:
  20. strArr.splice(i,1,‘&#60;‘);
  21. break;
  22. case ‘>‘:
  23. strArr.splice(i,1,‘&#62;‘);
  24. break;
  25. case ‘&‘:
  26. strArr.splice(i,1,‘&#38;‘);
  27. }
  28. }
  29. }
  30. return strArr.join(‘‘);
  31. }
  32. alert(str.displayHtml());
  33. document.all.div2.innerHTML=str.displayHtml();
  34. </script>
  35. </body>
  36. </html>

上面在赋给div之前没有转换,所以显示不正常,第二个div显示正常,显示结果如下:


技术分享

JSP到HTML特殊字符转换

以上是通过JS将后台传递过来的数据显示在页面之前的转换,有时是通过JSP生成HTML页面内容,此时的特殊字符会比上面多,另外此时的转换需要通过服务器端转换后再输出到HTML页面。如 jsp页面在生成HTML时如下:
Html代码 技术分享
  1. <input type=‘txt‘ value=‘<%=msg %>‘>
如果 msg 为 I‘am> 时,第一页面会乱,第二文本框中显示的值不正确
技术分享
。这是由于HTML标签属性值可以使用双引号也可使用单引号,如果HTML使用的是单引号,而值中也包含单引号时,就会出现问题,双引号同样也有这样的问题,由于大都数情况下,页面中属性使用双引号还是单引号没有规范下来,所以服务器端传递来的单引号与双引号都需要转换。另外像<、>就不用说了,也是需要转换的,所以此种情况下应该至少<>"‘& 这5个需要特殊转换。
Java代码 技术分享
  1. // HTML字符转换表
  2. public final static Map<String, String> HTML_CHAR = new HashMap<String, String>();
  3. static {
  4. HTML_CHAR.put("&", "&#38;");
  5. HTML_CHAR.put("\"", "&#34;");
  6. HTML_CHAR.put("<", "&#60;");
  7. HTML_CHAR.put(">", "&#62;");
  8. HTML_CHAR.put("‘", "&#39;");
  9. }
  10. public static final StringBuilder toHTMLChar(String str) {
  11. if (str == null) {
  12. return new StringBuilder();
  13. }
  14. StringBuilder sb = new StringBuilder(str);
  15. char tempChar;
  16. String tempStr;
  17. for (int i = 0; i < sb.length(); i++) {
  18. tempChar = sb.charAt(i);
  19. if (HTML_CHAR.containsKey(Character.toString(tempChar))) {
  20. tempStr = (String) HTML_CHAR.get(Character
  21. .toString(tempChar));
  22. sb.replace(i, i + 1, tempStr);
  23. i += tempStr.length() - 1;
  24. }
  25. }
  26. return sb;
  27. }
在输出到HTML之前使用上面的toHTMLChar(msg).toString()转换一下即可:
技术分享

Java到JSON特殊字符转换

由于从服务器后端生成JSON格式的字符串,最后传递到客户端由 eval() 函数动态的生成Javascript,如果JSON字符串格式错误,则eval解析会出错,经常也是最常出错的是" ‘ \r\n 这三个字符,如 {name:‘I‘am‘}解析时会出错,同样,由于JavaScript中的字符串可由单引号也可由双引号引起来,所以双引号一样也有这样问题。另外,字符串是不能跨行写的,即你不能写成这样:{name:"I‘

am"}

所以这3个需要转换,另外换行可能依赖于平台,所以 \n 也需要转换,比如我们需要将后台抛出的异常栈信息以JSON的格式传回到浏览器上显示时,就需要将回车换行转换。代码如下:

Java代码 技术分享
  1. response.setContentType("application/json");
  2. Writer wr = response.getWriter();
  3. if(exceptionTrace.indexOf("‘")!=-1){
  4. //将单引号转义一下,因为JSON串中的字符串类型可以单引号引起来的
  5. exceptionTrace = exceptionTrace.replaceAll("‘", "\\‘");
  6. }
  7. if(exceptionTrace.indexOf("\"")!=-1){
  8. //将双引号转义一下,因为JSON串中的字符串类型可以单引号引起来的
  9. exceptionTrace = exceptionTrace.replaceAll("\"", "\\\"");
  10. }
  11. if(exceptionTrace.indexOf("\r\n")!=-1){
  12. //将回车换行转换一下,因为JSON串中字符串不能出现显式的回车换行
  13. exceptionTrace = exceptionTrace.replaceAll("\r\n", "\\u000d\\u000a");
  14. }
  15. if(exceptionTrace.indexOf("\n")!=-1){
  16. //将换行转换一下,因为JSON串中字符串不能出现显式的换行
  17. exceptionTrace = exceptionTrace.replaceAll("\n", "\\u000a");
  18. }
  19. wr.write("{success:false,exception:true,msg:‘" +exceptionTrace + "‘}");
  20. wr.flush();
  21. wr.close();

最常用的字符实体(Character Entities)

显示结果说明Entity NameEntity Number
显示一个空格&nbsp;&#160;
<小于&lt;&#60;
>大于&gt;&#62;
&&符号&amp;&#38;
"双引号&quot;&#34;

其他常用的字符实体(Character Entities)

显示结果说明Entity NameEntity Number
?版权&copy;&#169;
?注册商标&reg;&#174;
×乘号&times;&#215;
÷除号&divide;&#247;

 









2015第23周四HTML特殊字符显示问题

标签:

原文地址:http://www.cnblogs.com/doit8791/p/4552910.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!