检查表单元格块是否有数据,如果有则更改样式


Checking if table cell blocks have data and if so change the styling

我创建了一个表,我用它作为草稿板。这里有用户和玩家,他们必须进行选择。我想知道如果一个用户已经选择了一个球员,如果有任何方式,我可以样式的单元格块在不同的颜色风格,以显示该块更显着,它被选中。然后空块保留常规样式。

我创建了一个小提琴来展示表的外观。

https://jsfiddle.net/zmggLd57/

对于那些有名字的单元格,我想知道我是否可以把它们变成不同的颜色。

<table class="draft_border_table">
<tr>
    <th class="draft_table_number_th">RND</th>
<?php
// Output usernames as column headings
$userResults = mysqli_query($con, 'SELECT * FROM user_players ORDER BY `id`');
while ($userPlayer = mysqli_fetch_array($userResults)) {
    $userPlayerStore[] = $userPlayer;
    echo '<th class="draft_table_th"><div>' . $userPlayer['username'] . '</div></th>';
}
?>
</tr>
<?php
// Output each user's player 1-14 in each row
$totalPlayerNumbers = 14;
for ($playerNum = 1; $playerNum <= $totalPlayerNumbers; $playerNum++) {
    echo '<tr><td><div class="draftBorder">' . $playerNum . '</div></td>';
    foreach ($userPlayerStore as $userPlayer) {
        echo '<td class="draft_table_td">' . $userPlayer['player' . $playerNum] . '</td>';
    }
    echo '</tr>';
}
?>
</table>

我希望它能对你有所帮助。

$("td.draft_table_td").each(function(){
if($(this).text()!=""){
$(this).css("background-color","blue");
}
});
https://jsfiddle.net/7w3c384f/

为已填入或空白的表格单元格添加一个额外的css类。

...
foreach ($userPlayerStore as $userPlayer) {
    if (empty($userPlayer['player'.$playerNum])){
       $extra_class = 'emptycell';
    }else{
       $extra_class = 'filledcell';
    }
    echo '<td class="draft_table_td '.$extra_class.'">' .
          $userPlayer['player' .  $playerNum] . '</td>';
}

然后在你的。css

中添加适当的样式
 td.draft_table_td.emptycell {
     background: red;
 }