Question

我的每个循环都有一个jsp，现在我需要根据fruitStatus改变h2的背景颜色（即带有交付或inbag）

我的意思是如果它是fruitMapModel.fruitStatus [frutListData.fruitId]被传递，h2背景颜色为蓝色，如果它是＆＃39; inbag＆＃39;红色

<c:forEach var="frutListData" items="${fruitMapModel.fruitList}">
            <div id="fruitProgress<c:out value="${frutListData.fruitId}"/>">
                <li class="fruit">

                    <ul class="fruitheader" >
     <c:if test="${fruitMapModel.fruitStatus[frutListData.fruitId] == 'inBag' }">   
      </c:if>
   <c:if test="${fruitMapModel.fruitStatus[frutListData.fruitId] == 'delivered' }"> 
      </c:if>
                        <h2>  <c:out value="${fruitMapModel.fruitNameList[frutListData.fruitId]}" /> </h2>
                    </ul>
                </li>   
            </div>  
            </c:forEach>

.css文件

.fruit h2 {float:left;margin:0 20px 0 0;
                padding:14px 20px 13px 20px;
                background:#ccc;
                font:normal 16px 'museo_sans_rounded700', Arial, Helvetica, sans-serif;
                color:#666;text-transform:uppercase;
                -webkit-border-radius: 5px 5px 0px 0px;
                border-radius: 5px 5px 0px 0px;
               }                    

.fruitheader {overflow:hidden;}
.fruitheader li {float:left;margin:0 20px 0 0;}

我怎么能改变h2的背景颜色？请帮我解决这个问题。

Answer 1

让JSP在感兴趣的HTML元素的class属性中打印状态。

<ul class="fruitheader ${fruitMapModel.fruitStatus[frutListData.fruitId]}">

然后，通过CSS指定所需的样式。

.fruitheader.inBag h2 { background: red; }
.fruitheader.delivered h2 { background: blue; }

请注意，只要您使用JSP 2.0+并且该值不受用户控制，就不需要<c:out>。另见a.o. what is c:out used for in jsp

根据jsp中的状态更改标题的背景颜色

1 个答案: