Question

我有以下jQuery代码：

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

当选择选择框中的选项时，会突出显示行中的所有表格单元格。我已经下载并实现了jQuery cookie插件。我的问题是如何实现功能（附加代码），以便在刷新页面或用户注销时，表格单元格行将保持突出显示。

Answer 1

您只需将选定的颜色存储在Cookie中，然后再将其读回。您可以使用jquery cookie plugin。此处使用示例：

$(document).ready(function() {

    if ($.cookie("yourname")) {
        // applying color from cookie
        var color = $.cookie("yourname");
        $('div').css('background', color);
        $('select').val(color);
    }

    $('div').on('change', 'select', function() {
        // applying selected color, storing it in the cookie
        var color = $(this).val();
        $.cookie("yourname", color);
        $('div').css('background', color);
    });

});

DEMO

PS：对于演示，我使用稍微修改过的脚本，因为你还没有提供HTML标记。

Answer 2

谢谢你的回答。在以下代码中实现它的最佳方法是什么：

<?php
while ($row = mysql_fetch_assoc($result))

{
echo '<tr>';

echo '<td><input type="text" name="order_no[]" value="' . $row['Orderno'] . '"/></td>';
echo '<td><input type="text" name="order_date[]" value="' . $row['Orderdate'] . '"/>   </td>';
    echo '<td><input type="text" name="order_ordered_by[]" value="' . $row['Orderedby'] . '"/></td>';
    echo '<td><input type="text" name="order_supplier[]" value="' . $row['Supplier'] . '"/></td>';
    echo '<td><input type="text" name="order_total_price[]" value="' . $row['totalprice'] . '"/></td>';
    echo '<td><input type="text" name="order_requested_by[]" value="' . $row['requestedby'] . '"/></td>';
    echo '<td>';
    echo '<select name="order_status[]">';
    echo '<option></option>';
    echo '<option>Approved</option>';
    echo '<option>Pending</option>';
    echo '<option>Dissaproved</option>';
    echo '</select>';
    echo '</td>';
    echo '</tr>';

}
?>

向jQuery脚本添加cookie功能（确保表格单元格保持突出显示）

2 个答案: