Firefox，jQuery和jqgrid中的文本修饰问题

Posted 2021-04-19

我有问题Firefox不显示样式“text-decoration：line-through”。

我使用jqGrid显示药物列表。如果药物不活跃，则必须将其交叉。在我的afterInsertRow事件中，我这样做：

$('#' + rowid).css({ 'text-decoration': 'line-through', 'color': 'red' }) 

它适用于IE和Chrome，但Firefox只显示没有交叉线的红色文本。

当我查看firebug输出时，我可以看到<tr>元素具有样式定义，包括文本修饰，但它根本不显示我需要的方式。

答案

如果您将代码修改为

$('#' + ids[1] + " > td").css(
    { 'text-decoration': 'line-through', 'color': 'red' });

如果有效。如果您使用rownumbers: true并且不希望行号删除，则可以使用

$('#' + ids[1] + " > td:not(.jqgrid-rownum)").css(
    { 'text-decoration': 'line-through', 'color': 'red' });

还有一个小建议：使用gridview: true更快地填充jqGrid。在这种模式下，整个表包含将由jqGrid填充为一个siring，并将插入一个jQurey.append操作。 afterInsertRow事件的使用打破了规则，因为每一行都将插入jQurey.append操作，然后将被称为afterInsertRow。所以我的建议：使用gridview: true，不要使用afterInsertRow。要更改css，请使用loadComplete或gridComplete代替：

jQuery('#list').jqGrid({
    //...
    loadComplete: function() {
        var ids = jQuery('#list').getDataIDs();
        for (var i = 0; i < ids.length; i++) {
            $('#' + ids[i] + ' > td:not(.jqgrid-rownum)').css(
                { 'text-decoration': 'line-through', 'color': 'red' });
        }
    }
    // ...
});