lesscss逃避表达

时间:2011-10-04 00:09:37

标签: less

我正在使用LessCSS,java和colorbox。 Colorbox有一个css文件。其中一种风格如下:

.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

似乎我需要使用转义字符。当lesscss编译文件时,我收到错误

javax.servlet.ServletException: Parse Error: Syntax Error on line 77 (line 77, column 1) near
.cboxIE6 #cboxMiddleRight {
 _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}

然后我试了这个..

.cboxIE6 #cboxMiddleRight {
    _behavior: ~"expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split(\'\"\')[1], this.style.background = \"none\", this.style.filter = \"progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\" + this.src + \", sizingMethod=\'scale\')\")";
}

但是。我得到一个错误,说我错过了结束“}”

我不知道如何解决这个问题。当然这很简单,但我无法解决。

这是java less css配置(web.xml):

<servlet>
    <servlet-name>less</servlet-name>
    <servlet-class>com.asual.lesscss.LessServlet</servlet-class>
    <init-param>
        <param-name>compress</param-name>
        <param-value>true</param-value>
    </init-param>
    <init-param>
        <param-name>cache</param-name>
        <param-value>false</param-value>
    </init-param>
    <load-on-startup>1</load-on-startup>
    </servlet>


<servlet>
    <servlet-name>resource</servlet-name>
    <servlet-class>com.asual.lesscss.ResourceServlet</servlet-class>
    <load-on-startup>2</load-on-startup>
</servlet>

<servlet-mapping>
    <servlet-name>less</servlet-name>
    <url-pattern>*.css</url-pattern>
</servlet-mapping>

有什么想法吗?

提前致谢。

1 个答案:

答案 0 :(得分:4)

这对我来说很好:

.cboxIE6 #cboxMiddleRight {
  _behavior: ~`this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')"`;
}

但它也尝试在编译时执行JavaScript。为避免这种情况,您可以再添加一个引号:

.cboxIE6 #cboxMiddleRight {
  _behavior: ~`"\"this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('\\\"')[1], this.style.background = \\\"none\\\", this.style.filter = \\\"progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\\\" + this.src + \\\", sizingMethod='scale')\""`;
}

虽然它看起来很难看,但它可以归结为:

.cboxIE6 #cboxMiddleRight {
  _behavior: "this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('\"')[1], this.style.background = \"none\", this.style.filter = \"progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\" + this.src + \", sizingMethod='scale')";
}