刷新页面时，表格单元格突出显示行的颜色正在更改

Question

我有一个表，可以在选择选项时更改表单元的行颜色。但是当我刷新页面时，颜色会变回默认颜色。如何修复表格中突出显示的颜色？

这是我的 php 和 mysql 表的代码：

<?php

    while ($record = mysqli_fetch_array($result)) {

      echo"<tr>";
      echo"<td style='text-align : center;'>" . $record['id'] . "</td>";

      echo '<select name="select" onchange="myJSFunction(this)">
                  <option></option>
                  <option>Approved</option>
                  <option>Pending</option>
                  <option>Disapproved</option>
            </select>';
      echo "</td>";
      echo "</tr>";
    }
  }

  echo "</ul>";
  echo '<a class="btn btn-lg btn-success btn-block tp" href="view.php" style="margin-left: 740px; bottom: -1px; position: relative;" onclick="history.back();">Back</a>';

?>  

这是我用于突出显示表格单元格行的 jQuery 代码：

<script type="text/javascript">

  function myJSFunction(element) {
    var color = ['none', 'green', 'yellow', 'red'];
    $('select').change(function() {
      $(this).parents('tr').css('background', color[$(':selected', this).index()]);
    })
  }

</script>

Answer 1

可以使用cookies，可以获取cookies的所有相关功能here

用

在页面顶部设置一个空白cookie

document.cookie="saveselect=";

每次用户更改任何选择时，更新您的 javascript 函数中的 cookie，例如 record['id']|'selected value',record['id']|'selected value',.....

在更新 cookie 时，您需要注意 cookie 被覆盖而不是更新意味着获取现有值，将新值附加到它并将新数据写入 cookie。

现在，当页面在 while 循环中加载时，您可以将 cookie 的值通过 '|' 展开并将其转换为数组。

现在在每个选择中搜索创建的数组，如果它的值保存在 cookie 中，如果是，则使用“已选择”属性选择选项。这样，您选择的值将在选择框中。

您需要将以下脚本添加到代码中。它将检查所有创建的选择，然后根据所选值更改每个选择颜色。

<script type="text/javascript">
$(document).ready(function(){
     var color = ['none', 'green', 'yellow', 'red'];
     $('select').each(function(){
        $(this).parents('tr').css('background', color[$(':selected', this).index()]);
     })
});
</script>

我已经为你提供了完整的逻辑并创建了 jquery 来为每个选择框设置颜色。

Answer 2

您也可以在用户更改颜色时创建会话，或者您也可以将颜色值存储在数据库中