拼接字符串时，单引号与双引号的问题

在利用JQuery动态的操作DOM时，往往需要添加一些比较复杂的内容，比如：利用JQuery动态生成一个复杂的表头，再给表头的的文字添加一些事件：点击某个列名，对该列进行排序什么的。

如果直接写在HTML中很简单：

<th rowspan="3" valign="middle" class="th3_3">
<c:if test="${orderBy eq 'order'}">
<c:choose>
<c:when test="${orderSc eq 'desc'}"><img src="img/drop2.gif"></c:when>
<c:otherwise><img src="img/drop1.gif"></c:otherwise>
</c:choose>
</c:if>
<a href="javascript:doOrder('order');">序号</a>
</th>

但是，如果要用JQuery动态生成表头的话，则比较复杂。

可以这么写：

 

var str = "
<th rowspan='3' valign='middle' class='th3_3'>
<c:if test='${orderBy eq 'order'}'>
<c:choose>
<c:when test='${orderSc eq 'desc'}'><img src='img/drop2.gif'></c:when>
<c:otherwise><img src='img/drop1.gif'></c:otherwise>
</c:choose>
</c:if>
<a href='javascript:doOrder('order');'>序号</a>
</th>
";

然后再使用JQuery 的append（）函数，$.append(str);

你会发现这是错误的。单引号里面不可能再有单引号了。

解决方法有三:

1、单引号里面如果还有引号的话，将其替换成双引号。

2、对于<a href='javascript:doOrder('order');'>序号</a>里面的传值完全可以采用<a href='#' onclick='javascript:doOrder(this)' value='order'></a>这种方法来解决，外面函数直接

这样调用 XX.value;

3.采用JSTL的方式，将某一变量设值<c:set var='desc' value= 'desc' scope='page'/>。字符串就可以直接引用了var str=" <c:when test='${orderSc eq desc}'>";

记录下，防止，以后自己忘记掉。