Question

我尝试更改$key值时设置颜色。我的意思是我的$key更改时正在生成一个表。现在，我要在 $ key更改并创建新表时设置其他bg颜色。现在<th colspan="5">{{$key}}</th>正在更改，并为每个$key创建表，我需要设置$key正在更改的颜色。

@foreach($lists as $key => $ser)
    <table class="table table-striped table-bordered table-hover" id="sample_3">
        <thead>
        <tr>
            <th colspan="5">{{$key}}</th>
        </tr>
        <tr>
            <th> Destination</th>
            <th> Services</th>
            <th> Status</th>
            <th> Time</th>
        </tr>
        </thead>
        <tbody>
        @foreach($ser as  $s)
            <tr>
                <td style="background: rgb(176,224,230);"> TE 17 <br/>{{$s->sp}}</td>
                <td> {{$s->dd}}</td>
                <td> {{$s->ss}}</td>
                <td> {{$s->dt}}</td>
            </tr>
        @endforeach
        </tbody>
    </table>
@endforeach

Answer 1

您可以使用变量在每个循环中存储$key的值。然后，您可以检查$key是否与前一个相同，并相应地更改颜色。

@php($prevvalue='')
@foreach($ser as  $s)
<tr>
    <td  style="background: {{$s->key == $prevvalue ? 'oldcolor','newcolor'}}"> TE 17 <br/>{{$s->sp}}</td>
    <td> {{$s->dd}}</td>
    <td> {{$s->ss}}</td>
    <td> {{$s->dt}}</td>
</tr>
@php($prevvalue = $s->key)
@endforeach

Answer 2

您可以先将刀片中的类添加到具有相似值的组元素中：

@php($prev = null)
@php($counter = 1)
@foreach($ser as  $s)
    @php 
        $counter = $s->key == $prev || is_null($prev) ? $counter : $counter + 1;
    @endphp
    <tr>
        <td class="td_color_{{ $counter }}"> TE 17 <br/>{{$s->sp}}</td>
        <td> {{$s->dd}}</td>
        <td> {{$s->ss}}</td>
        <td> {{$s->dt}}</td>
    </tr>
    @php($prev = $s->key)
@endforeach

这将为您提供每个<tr>中第一列的内容：

<td class="td_color_1">...</td>
<td class="td_color_1">...</td>
<td class="td_color_2">...</td>
<td class="td_color_2">...</td>
<td class="td_color_3">...</td>
<td class="td_color_4">...</td>
<td class="td_color_5">...</td>

然后在CSS中为这些颜色设置颜色：

<style type="text/css">
    td.td_color_1 { background: red; }
    td.td_color_2 { background: blue; }
    td.td_color_3 { background: green; }
    td.td_color_4 { background: yellow; }
    td.td_color_5 { background: pink; }
</style>

如何基于foreach循环中的键更改来更改表'td'的颜色

2 个答案: