我具有如下表结构，我正在使用PHP变量存储值，我想基于文本是否包含在行中等于PHP变量值来添加闪烁效果以完成行，然后将该行以绿色闪烁为其他颜色。我试过下面的代码，但它只会更改该单元格的背景颜色，而不会闪烁效果以完成行。如何添加闪烁效果以完成行？任何帮助，将不胜感激。提前致谢。
<html>
<head>
</head>
<title> Employee Data</title>
<?php
$empName = "Mr ABC";
?>
<table id="emp_data" class="table table-striped">
<thead>
<tr bgcolor="#E6E6FA">
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Address</th>
</tr>
</thead>
<tr>
<td>20015</td>
<td class='grn'>Mr ABC</td>
<td>[email protected]</td>
<td>1 st, Mumbai, IN </td>
</tr>
<tr>
<td>20016</td>
<td class='grn'>Mr XYZ</td>
<td>[email protected]</td>
<td>1 st, Mumbai, IN </td>
</tr>
</table>
</html>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#emp_data td.grn').each(function(){
var empName = '<?php echo $empName; ?>';
if ($(this).text() == empName) {
$(this).css('background-color','#080');
}
});
});
</script>
最佳答案
最好将数组用于表数据，
我在下面的代码中使用了它并循环处理：
<html>
<head>
</head>
<title> Employee Data</title>
<?php
$empName = "Mr ABC";
$tableArray = array(
[
"id" => 20015,
"name" => "Mr ABC",
"email" => "[email protected]",
"address" => "1 st, Mumbai, IN",
],
[
"id" => 20016,
"name" => "Mr XYZ",
"email" => "[email protected]",
"address" => "1 st, Mumbai, IN",
]
);
?>
<table id="emp_data" class="table table-striped">
<thead>
<tr bgcolor="#E6E6FA">
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Address</th>
</tr>
</thead>
<?php
foreach( $tableArray as $row ) {
$blink = ( $row['name'] == $empName ) ? true : false;
?>
<tr class='<?= $blink ? "blink" : "" ?>'>
<td><?= $row['id']; ?></td>
<td class='grn'><?= $row['name']; ?></td>
<td><?= $row['email']; ?></td>
<td><?= $row['address']; ?></td>
</tr>
<?php } ?>
</table>
<style>
.blink {
color: #FF0000;
animation: blinker 1s linear infinite;
}
@keyframes blinker {
50% {
opacity: 0;
}
}
</style>
</html>