文章/答案/技术大牛

发布

社区首页 >问答首页 >DisplayTag行颜色

问DisplayTag行颜色
EN

Stack Overflow用户

提问于 2012-12-01 18:01:55

回答 1查看 4.3K关注 0票数 0

我有一个关于displaytag的问题，我想改变某些行的背景颜色，但是我不能。我遵循这个例子http://raibledesigns.com/rd/entry/displaytag_changing_a_row_s，但是什么也没有发生。

下面是我的jsp：

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
<%@taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%@ taglib uri="http://displaytag.sf.net" prefix="display" %>
<jsp:directive.page contentType="text/html; charset=UTF8" />
<html> 
<head>
<title><spring:message code="label.listeggrafo" /></title>
<script type="text/javascript">

var table = document.getElementById("eggrafa");  
alert(table); 
var tbody = table.getElementsByTagName("tbody")[0];
var rows = tbody.getElementsByTagName("tr");
// add event handlers so rows light up and are clickable
for (i=0; i < rows.length; i++) {


    rows[i].style.backgroundColor = "red";

}

</script>

</head>
<body>
<display:table   name="eggrafa" requestURI="" sort="list"  class="sample" id="eggrafa" export="true" pagesize="10">



  <display:column  media="html"  href="deleteeggrafo.html"  paramId="idtypiko" paramProperty="idtypiko"><img src="<%=request.getContextPath()%>/images/delete.png" />     </display:column>

<display:column property="aa" sortable="true"  href="updateeggrafo.html"
    paramId="idtypiko" paramProperty="idtypiko"  titleKey="label.aa"></display:column>
<display:column property="fakelos_eggrafou" sortable="true" titleKey="label.fakelos"></display:column>
<display:column  property="diabathmisi" sortable="true"  titleKey="label.diab"></display:column>
<display:column property="apostoleas" sortable="true" titleKey="label.apostol"></display:column>
<display:column property="tautotitaeg" sortable="true" titleKey="label.tauteg"></display:column>
    <display:column property="hmeromhniaypog" sortable="true" titleKey="label.hmeryp"></display:column>

    <display:column property="year" sortable="true" titleKey="label.year"></display:column>


<display:column property="filename" sortable="true" href="downloadfileeggrafo.html" paramId="idtypiko" paramProperty="idtypiko" titleKey="label.filename"/>


<display:setProperty name="paging.banner.one_item_found"><span style="background-color: rgb(250, 240, 230)" class="pagebanner"> Ένα {0} βρέθηκε. </span></display:setProperty>
<display:setProperty name="basic.msg.empty_list">Δεν βρέθηκαν Έγγραφα</display:setProperty>
   <display:setProperty name="paging.banner.all_items_found"><span style="background-color: rgb(250, 240, 230)" class="pagebanner"> {0} {1} βρέθηκαν, βλέπετε όλα τα {2}. </span> </display:setProperty>



 <display:setProperty  name="paging.banner.item_name">Έγγραφο</display:setProperty>
 <display:setProperty name="paging.banner.items_name">Έγγραφα</display:setProperty>
 <display:setProperty name="paging.banner.some_items_found"><span  style="background-color: rgb(250, 240, 230)" class="pagebanner"> {0} {1} βρέθηκαν, βλέπετε {2} έως {3}. </span>   </display:setProperty>
  <display:setProperty name="paging.banner.first"><span style="background-color: rgb(250, 240, 230)" class="pagelinks"> [Πρώτη/Προηγούμενη] {0} [ <a href="{3}">Επόμενη</a>/ <a href="{4}">Τελευταία</a>] </span> </display:setProperty>
  <display:setProperty name="paging.banner.last"><span style="background-color: rgb(250, 240, 230)" class="pagelinks">[ <a href="{1}">Πρώτη</a>/ <a href="{2}">Προηγούμενη</a>] {0} [Επόμενη/Τελευταία] </span></display:setProperty>
   <display:setProperty name="paging.banner.full"><span style="background-color: rgb(250, 240, 230)" class="pagelinks"> [<a href="{1}">Πρώτη</a>/ <a href="{2}">Προηγούμενη</a>] {0} [ <a href="{3}">Επόμενη</a>/ <a href="{4}">Τελευταία </a>]</span> </display:setProperty>
<display:setProperty name="export.banner"><div style="background-color: rgb(250, 240, 230)" class="exportlinks"> Εξαγωγή σε Αρχείο: {0} </div></display:setProperty>


</display:table>

</body>
</html>

同时，警报消息也会返回null。有谁知道我做错了什么吗？

jsp

row

displaytag

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-12-01 22:36:42

在浏览器加载页面之前，您正在访问DOM。所以它还没有包含你的表。

我建议使用jQuery，一旦DOM准备就绪，就可以在JavaScript中完成所有工作：

$(document).ready(function() {
    $('#eggrafa tbody tr').css('background-color', 'red');
});

不过，我不确定您是否可以设置tr的背景色，因此您可能需要设置每个td的背景色：

$(document).ready(function() {
    $('#eggrafa tbody td').css('background-color', 'red');
});

使用vanilla JS可以做到这一点，但它不太简洁，而且很难支持所有浏览器。

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/13658330

复制

相似问题

问DisplayTag行颜色
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问DisplayTag行颜色EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问DisplayTag行颜色
EN