Django多字段SearchHeadline搜索词高亮显示问题求助

要实现title和short_description两个字段的分别高亮，只需为每个字段单独创建SearchHeadline注解即可，无需合并字段。以下是具体修改步骤：

修改views.py代码 #

在get_queryset方法中，为short_description字段新增一个SearchHeadline注解，与title字段使用相同的高亮样式：

class SearchResultsList(LoginRequiredMixin, ListView, CategoryMixin):
    model = QA
    context_object_name = "query_list"
    template_name = "search/SearchView.html"
    
    def get_queryset(self):
        query = self.request.GET.get("q")
        search_vector = SearchVector("title", weight="A") + SearchVector("short_description", weight="B")
        search_query = SearchQuery(query)
        
        # 为title字段创建高亮注解
        headline_title = SearchHeadline(
            'title', 
            search_query, 
            start_sel='<span class="text-decoration-underline sidebar-color">',
            stop_sel='</span>'
        )
        
        # 为short_description字段创建高亮注解
        headline_desc = SearchHeadline(
            'short_description', 
            search_query, 
            start_sel='<span class="text-decoration-underline sidebar-color">',
            stop_sel='</span>'
        )
        
        return QA.objects.annotate(
            search=search_vector,
            rank=SearchRank(search_vector, search_query),
            headline=headline_title,
            short_description_headline=headline_desc
        ).filter(rank__gte=0.3).order_by("-rank")

修改模板SearchView.html #

将原本输出short_description的地方，替换为新增的高亮注解字段short_description_headline：

{% for query in query_list %}
    <div class="col-12">
        <a href="{{ query.get_absolute_url }}"><h2>{{query.headline | safe}}</h2></a>
        <p>{{query.short_description_headline | safe}}</p>
    </div>
{% empty %}
    <div>No results</div>
{% endfor %}

说明 #

• 两个字段各自保留独立的HTML元素，无需合并展示
• SearchHeadline会返回完整字段内容并高亮匹配的搜索词，不会只显示预览
• 保持了原有的排序和权重逻辑，不影响搜索结果的排序优先级

内容的提问来源于stack exchange，提问作者Adrian