Question

  <c:forEach items="${list}" var="item">
    <div class="block" id="${item.id}" style="background: black"></div>
</c:forEach>

第一次加载页面时，样式div是否可能取决于当前item.id避免使用div中的jsp <c:choose> <c:when test="${ item.num == 0}">？

item.num可以是1或0。

需要这样的东西：

 if(item.num==0){
    style="background: black"
    }else{
    style="background: transparant"
    }

Answer 1

是的，但是如果您的item.id是数字格式，那么建议在其上附加一个字符串例如："id=list_"{item.id}，因为某些浏览器在处理id时会出现一些问题，这些问题以数字开头

现在，为所有div分配了唯一ID后，您就可以为任何个人设置样式。假设你想用item.id = 123设置div的样式，那么你可以使用下面的脚本，

$(document).ready(function(){
    $("#list_123").css("background-color","red");
});

编辑：您可以在动态生成的div中创建新的数据属性，

<div class="block" id="list_"${item.id} style="background: black" data-num=${item.num}>

现在从您的jQuery中，您可以使用class=block遍历所有div，并找到值为0的data-num属性，

$(document).ready(function(){
    $('.block').each(function(i, obj) {
        if($(this).attr("data-num")=="0"){
            $(this).css("background-color","black");
        }
    });
});

Here is a working example

Answer 2

你有没有想过CSS？

.block:nth-child(odd) { 
    background-color:#black; 
}
.block:nth-child(even) { 
    background-color:transparent; 
}

Answer 3

为什么不简单地使用三元运算符？这里不需要jQuery ......

<c:forEach items="${list}" var="item">
    <div class="block" id="${item.id}" style="background: ${item.num==0?'black':'white'}"></div>
</c:forEach>

更新

如果要正确执行此操作，请尝试避免使用内联样式并添加css类。因此，您可以在单独的文件中轻松定义样式。

<c:forEach items="${list}" var="item">
    <div class="block block-${item.num==0?'black':'white'}" id="${item.id}"></div>
</c:forEach>

和相应的css文件。

/** myApp.css */
.block-black {
    background: black;
}
.block-white {
    background: white;
}

更新2

另一种解决方案可能是将结果保存到变量。

<%-- save result to variable (${itemBackground}) for better reusability -->
<c:forEach items="${list}" var="item">
    <c:set var="itemBackground" value="${item.num==0?'black':'white'}">
    <div class="block ${itemBackground}" id="${item.id}"></div>
</c:forEach>

Answer 4

如果您只想影响ID为0的一个div，这就是您想要的。您还需要在其前面添加一个字符串。

@assignment = Assignment.new

您还可以传递这样的样式对象：

$('#item-0').css('background', 'black');

但是，如果它总是第一个我建议使用纯CSS。

$('#item-0').css({
  background: 'black',
  color: 'white'
});

如何用jQuery设置div样式？

4 个答案:

更新

更新2

如何用jQuery设置di​​v样式？

4 个答案:

更新

更新2

如何用jQuery设置div样式？