当前位置: 首页 > 知识库问答 >
问题:

更改Thymeleaf表格单元格中子字符串的颜色不工作

阎劲
2023-03-14

我正在将用PHP/超文本标记语言编写的旧遗留系统重写成Java /SpringBoot/Thymeleaf.在旧系统中,有一个显示搜索结果的表。在“句子”一栏中,我调用这个函数,以便突出显示句子字符串中的搜索关键字。

function highlightKeywords($sentence, $keywords_array){
$resultSentence = "";
$sentenceArray = explode(" ", $sentence);

for($i = 0; $i < count($sentenceArray); $i++){    
        $token = $sentenceArray[$i];
        if(containsToken($token, $keywords_array)){
        $token = "<mark>".$token."</mark>";
        }
        $resultSentence = $resultSentence." ".$token;
    }
return $resultSentence;
}

示例:seach关键字是“Macron”,从数据库中查询到的句子是“Emmanuel Macron周五与安吉拉·默克尔会面,讨论难民危机”所以这个句子的“马克龙”子串是黄色的。

现在我试图在Thymeleaf中做同样的事情,所以我写了这个Java方法:

public static String highlightSearchParams(String sentence, String keyword) {
        StringBuilder stringBuilder = new StringBuilder();
        String[] tokens = sentence.split(" ");
        for (String token : tokens) {
            if (keyword.equals(token)) {
                token = "<mark class=\"red\">" + token + "</mark>";
            }
            stringBuilder.append(token);
            stringBuilder.append(" ");
        }
        return stringBuilder.toString();
    }

在我的Thymeleaf模板中,我调用该方法:

<td th:text="${T(util.DataRepresentationUtils).highlightSearchParams(result.sentence, keywords)}">...</td>
        

在CSS中,我添加了以下样式:

mark.red {
    color:#ff0000;
    background: none;
}

但它不起作用。虽然标签被添加到子字符串中,但子字符串的颜色不变。有人知道问题出在哪里吗?

非常感谢。

编辑:

我改变了我的风格:

.keyword {
  color: black;
}

和Java方法来:

public static String highlightSearchParams(String sentence, String keywordsString) {
        StringBuilder stringBuilder = new StringBuilder();
        String[] tokens = sentence.split(" ");
        String[] keywords = keywordsString.split(" ");
        for (String token : tokens) {
            for (String keyword : keywords) {
                if (!"".equals(keyword) && !" ".equals(keyword) && keyword.equals(token) || token.contains(keyword)) {
                    token = "<mark class=\"keyword\">" + token + "</mark>";
                }
            }
            stringBuilder.append(token);
            stringBuilder.append(" ");
        }
        return stringBuilder.toString();
    }

编辑2:

我意识到我根本不需要CSS风格,因为我希望我的角色有黑色。所以我把我的Java方法改为:

public static String highlightSearchParams(String sentence, String keywordsString) {
        StringBuilder stringBuilder = new StringBuilder();
        String[] tokens = sentence.split(" ");
        String[] keywords = keywordsString.split(" ");
        for (String token : tokens) {
            for (String keyword : keywords) {
                if (!"".equals(keyword) && !" ".equals(keyword) && keyword.equals(token) || token.contains(keyword)) {
                    token = "<mark>" + token + "</mark>";
                }
            }
            stringBuilder.append(token);
            stringBuilder.append(" ");
        }
        return stringBuilder.toString();
    }

但是如果你想改变字符的颜色,使用第一个编辑部分的方法。

共有1个答案

燕刚捷
2023-03-14

我试过你的手机壳,它在Chrome和Firefox上都很好用。我认为我们需要详细说明你的CSS。如果这个标记确实被添加到了td的html内容中,那么你的CSS就有问题了。您可以查看浏览器的开发者工具。(通常通过F12调用)在td中找到行为不端的标记,并详细说明实际应用的样式表属性。也许有!代码中其他地方的重要属性会覆盖您的设置。

<html>
<head>
    <style>
        mark.red {
            color:#ff0000;
            background: none;
        }
        table, tr  {
            border: 1px solid black;
        }
        th  {
            border-top: 1px solid black;
        }
    </style>
</head>
<body>

<table>

    <tr>
        <th>
            ID
        </th>
        <th>
            Sentence
        </th>
        <th>
            Other Column
        </th>
    </tr>


    <tr>
        <th>
            1
        </th>
        <th>
            Hello World
        </th>
        <th>
            Today
        </th>
    </tr>
    
    <tr>
        <th>
            1
        </th>
        <th>
            Emmanuel <mark class="red">Macron</mark> meets Angela Merkel on Friday to discuss refugee crisis.
        </th>
        <th>
            Today
        </th>
    </tr>

</table>

</body>
</html>
 类似资料:
  • 问题内容: 我想制作一个可编辑的表,然后检查数据以确保其有效。我不确定如何仅更改一个单元格的颜色。我想要一个单元格,例如(0,0)并将前景颜色设置为红色。我已经阅读了SO和Oracle上有关自定义ColorRenderer的其他文章,但是我不知道如何使用它。 谢谢。 问题答案: 假设您要用其他颜色渲染的单元格代表一种状态(我将以“拒绝并批准”为例)。然后,我将在我的表模型中实现一个名为getSta

  • 问题内容: 我试图使自己熟悉JTables,TableModels,JTableHeaders,渲染器等。我试图制作一个简单的虚拟表(出于练习目的),看起来像这样: 我还希望B2单元格-并且只有该单元格-具有蓝色(Color.BLUE)背景-所有其他单元格都可以具有自动分配的Swing默认颜色。 我的代码在下面,并且基于我在本网站和整个互联网上发现的无数示例。但是我没有得到想要的结果。相反,我得到

  • 我试图在我的文档末尾设置一个新表,并根据我的规格将其格式化。但是背景色和文本色似乎不起作用。字体大小也不完全是我想要的,因为它适用于整个表格,而不仅仅是一个单元格。 这就是我到目前为止所做的: 我想要表格的第一行没有边框,字体14,粗体,灰色背景上的白色文本。

  • 我需要用Java和Jsoup解析一个表,并根据它的值改变单元格的颜色。这就是html表格的外观,也是单元格颜色需要定义的方式 我写了一个脚本,可以准备好单元格的值并从中更改文本,但是我无法也更改颜色。 这是我收到的错误:

  • 我正在使用Apache POI读取零件编号电子表格中的数据。我在我们的数据库中查找零件编号,如果我们有零件的计算机辅助设计图纸,我将零件编号单元格涂成绿色,如果没有,我将其涂成红色。处理完成后,将保存电子表格。我遇到的问题是那列中的每个细胞都是绿色的。我已经完成了代码,查找零件号的逻辑工作正常,确定单元格应该是什么颜色以及设置颜色和填充的逻辑似乎也工作正常。知道我做错了什么吗? 谢谢