开发者社区> 落雨_> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

【java】在jsp的js和css里面使用EL表达式取值|style里面用$取值

简介: 众所周知,如果直接在jsp的js或者css语句块里面写${***}取值的话,程序会不识别这玩意,但是,我们有时候确实需要动态取值,比如,js为了获得对象的某一个值,不方便用js的getElementById()方法的话,我们需要这个${**}可能会简便一百倍,那么好吧,我们用jstl标签的来解决这个问题。
+关注继续查看

众所周知,如果直接在jsp的js或者css语句块里面写${***}取值的话,程序会不识别这玩意,但是,我们有时候确实需要动态取值,比如,js为了获得对象的某一个值,不方便用js的getElementById()方法的话,我们需要这个${**}可能会简便一百倍,那么好吧,我们用jstl标签的<c:out value ='${}'/>来解决这个问题。

 

例如:我的项目文件里面的jsp页面全部放在工程的WebRoot下的WEB-INF里面,网站发布出去的话,用户是一个页面都看不到的,这更加安全,但是也有一个问题,就是路径会2B,因为全部是靠struts2的配置文件跳到页面去的,所以路径必须动态取值。可是我的css里面,你说该怎么写。

<style type="text/css">

body

        {

           behavior: url(需要动态取值的项目名/css/hover.htc);background:#fff;

        }

</style>

但是你要是直接写

body

        {

          behavior: url(${pageContext.request.contextPath}/css/hover.htc);background:#fff;

       }

程序就不识别了会当做字符串处理,就是一个url路径,很杯具。其实我们换个思路就好了,我们只需要把值取出来即可,就用c:out标签刚刚好,这个原理同样适用于js。如下即是正确的代码,最后的cout标签别忘了关  --->  "<c:out value= ' ${}' / >"

jsp页面头部别忘记引入

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


 最终代码:

body

        {

           behavior: url(<c:outvalue='${pageContext.request.contextPath}'/>/css/hover.htc);background:#fff;

        }

js也是这样,想怎么取值就怎么取值,还有多种标签随你玩,赶紧试试吧。。

 var step = "<c:out value='${step}' default='0'/>";   

   switch(step) {     

   case "0":      .....................     

   default:       

   break;   

}   

   var total = <c:out default="0" value="${total}"/>;   

  var orderPrice=<c:out value='${packageProductOrder.order.sum}'/>;  

   <c:set scope="page" var="singleProductSize" value="0"/>  

   <c:forEach items="${packageLine.journeys}" var="journeysItem" varStatus="loopStatus">  


js部分参考 http://blog.csdn.net/cilen/article/details/7438291

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
html+css实战159-vertical-align-01
html+css实战159-vertical-align-01
14 0
html+css实战142-banner-精品推荐
html+css实战142-banner-精品推荐
19 0
html+css实战144-banner-精品推荐-内容
html+css实战144-banner-精品推荐-内容
19 0
html+css实战145-banner-版权区域-布局
html+css实战145-banner-版权区域-布局
8 0
html+css实战143-banner-精品推荐-标题
html+css实战143-banner-精品推荐-标题
18 0
html+css实战139-banner-right-标题
html+css实战139-banner-right-标题
10 0
html+css实战138-banner-左边布局完成
html+css实战138-banner-左边布局完成
15 0
html+css实战140-banner-right-内容
html+css实战140-banner-right-内容
10 0
html+css实战141-banner-right-全部课程
html+css实战141-banner-right-全部课程
15 0
html+css实战135-按钮
html+css实战135-按钮
13 0
+关注
落雨_
http://js-dev.cn
813
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载