在 onclick 事件中转义传递给 js 函数的字符串中可能的引号答案

【问题标题】：escape possible quotes in string passed to a js function in a onclick event在 onclick 事件中转义传递给 js 函数的字符串中可能的引号
【发布时间】：2012-01-25 12:02:41
【问题描述】：

我在 jspx 中有以下循环：

<c:forEach var="var" items="${dataFile.list.rows}">
  <li>
    <div>
      <a href="#" onClick="myFunct('${var.url}','escape(${var.title}),'escape(${var.descr})');">
        <img width="108" height="66" alt="" src="${var.img}" />
      </a>
    </div>
  </li>
</c:forEach>

函数 myFunct 自己做一些事情。当${var.title} 或${var.descr} 包含引号或双引号时，我的问题就会出现。我无法提前知道是否会有一些或哪些。

我尝试了上述方法，我在元素之前尝试了一个小助手 js 部分，但不知道我将拥有哪种引号我无法猜测是否需要放置 escape("${var.title}"); 或 escape('${var.title}'); .

关于如何解决这个问题的任何想法？谢谢。

【问题讨论】：

标签： javascript jsp quotes

【解决方案1】：

我建议你在服务器上编码 http://www.roseindia.net/jsp/jsp-url-encoding.shtml

或将内容存储在隐藏元素中

<span id="url" style="display:none">${var.URL}</span>
<span id="title" style="display:none">${var.title}</span>
<span id="desc" style="display:none">${var.descr}</span>

然后做onClick="return myFunct(['url','title','desc'])">...</a>

function myFunct(parms) {
  var url   = parms[0]?document.getElementById(parms[0]).innerHTML:"No url";
  var title = parms[1]?document.getElementById(parms[1]).innerHTML:"No title";
  var descr = parms[2]?document.getElementById(parms[2]).innerHTML:"No description";
  return false;
}

【讨论】：

【解决方案2】：

您需要将有效的 JavaScript 字符串文字传递给 myFunct。 escape 是一个 JavaScript 函数，它也需要一个有效的字符串。因此，您需要将 Java 字符串转换为有效的 JavaScript 文字。使用 apache commons-lang StringEscapeUtils.escapeECMAScript 转义它。您可以将其设为 EL 函数，从而使用类似

onClick="myFunct('${myFn:escapeJs(var.url)}','${myFn:escapeJs(var.title)}, '${myFn:escapeJs(var.descr)}');"

【讨论】：

【解决方案3】：

您应该在服务器端进行，而不是在客户端。无论如何，在客户端执行此操作为时已晚。根据值的唯一用途，无论是用作 HTML 的一部分且不包含换行符，还是用作 JS 代码，您都可以使用 JSTL 提供的 EL 函数fn:escapeXml()

<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
...
<a onclick="myFunct('${var.url}','${fn:escapeXml(var.title)}','${fn:escapeXml(var.descr)}');">

或创建一个自定义 EL 函数，它在后台使用 Apache Commons Lang StringEscapeUtils#escapeJavaScript()。

<%@taglib prefix="my" uri="http://example.com/functions" %>
...
<a onclick="myFunct('${var.url}','${my:escapeJs(var.title)}','${my:escapeJs(var.descr)}');">

您可以在this answer底部找到一个如何创建EL函数的具体示例。

我猜它会被用作 HTML 的一部分，所以 fn:escapeXml() 可能就足够了。

【讨论】：

这对我有用。是的，它不应该在客户端完成，但不幸的是我对此无能为力。我知道它只是文本，所以我使用了 escapeXml。谢谢。

【解决方案4】：

您无需创建自己的 EL 函数，而是直接从您的自定义 .tld 中使用 apache-commons：

<function>
    <name>escapeJavaScript</name>
    <function-class>org.apache.commons.lang.StringEscapeUtils</function-class>
    <function-signature>java.lang.String escapeJavaScript(java.lang.String)</function-signature>
</function>

【讨论】：